login/checkout
This commit is contained in:
@ -1,47 +1,32 @@
|
||||
import type { GenericResponse } from "~/types";
|
||||
import type { AddressesList } from "~/types/checkout";
|
||||
import type { AddressesList, UserAddressOfficial } from "~/types/checkout";
|
||||
import { validation } from "../utils/validation";
|
||||
import { REGEX_PHONE } from "../utils/regex";
|
||||
|
||||
export const useCheckoutStore = defineStore("checkoutStore", () => {
|
||||
const { $toast } = useNuxtApp();
|
||||
const menuStore = useMenuStore();
|
||||
const selectedIso = ref(menuStore.selectedCountry);
|
||||
|
||||
// get address list
|
||||
const addressesList = ref<AddressesList[]>();
|
||||
const activeAddress = ref<AddressesList | null>();
|
||||
async function restrictedAddress() {
|
||||
async function getAddressList() {
|
||||
try {
|
||||
// const { data } = await useMyFetch<GenericResponse<object>>(
|
||||
// `/api/restricted/user/addresses`,
|
||||
// {
|
||||
// headers: {
|
||||
// "Content-Type": "application/json",
|
||||
// },
|
||||
// onErrorOccured: async (_, status) => {
|
||||
// throw createError({
|
||||
// statusCode: status,
|
||||
// statusMessage: `HTTP error: ${status}`,
|
||||
// });
|
||||
// },
|
||||
// }
|
||||
// );
|
||||
|
||||
const data = [
|
||||
const { data } = await useMyFetch<GenericResponse<AddressesList[]>>(
|
||||
`/api/restricted/user/addresses`,
|
||||
{
|
||||
address: {
|
||||
city: "Bochnia",
|
||||
country_iso: "pl",
|
||||
name: "John",
|
||||
postcode: "32-700",
|
||||
street: "Karosek",
|
||||
surname: "Kornelsky",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
address_id: 2,
|
||||
alias: "home",
|
||||
customer_id: 4,
|
||||
is_default: true,
|
||||
is_official: false,
|
||||
},
|
||||
];
|
||||
onErrorOccured: async (_, status) => {
|
||||
throw createError({
|
||||
statusCode: status,
|
||||
statusMessage: `HTTP error: ${status}`,
|
||||
});
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
addressesList.value = data;
|
||||
activeAddress.value = addressesList.value[0];
|
||||
@ -50,6 +35,7 @@ export const useCheckoutStore = defineStore("checkoutStore", () => {
|
||||
}
|
||||
}
|
||||
|
||||
// get user data
|
||||
const userName = ref("");
|
||||
const lastName = ref("");
|
||||
const address = ref("");
|
||||
@ -58,65 +44,47 @@ export const useCheckoutStore = defineStore("checkoutStore", () => {
|
||||
const country = ref("");
|
||||
const phoneNumber = ref("");
|
||||
const accountPhoneNumber = ref("");
|
||||
async function restrictedAddressOfficial() {
|
||||
async function getUserData() {
|
||||
try {
|
||||
// const { data } = await useMyFetch<GenericResponse<object>>(
|
||||
// `/api/restricted/user/address/official`,
|
||||
// {
|
||||
// headers: {
|
||||
// "Content-Type": "application/json",
|
||||
// },
|
||||
// onErrorOccured: async (_, status) => {
|
||||
// throw createError({
|
||||
// statusCode: status,
|
||||
// statusMessage: `HTTP error: ${status}`,
|
||||
// });
|
||||
// },
|
||||
// }
|
||||
// );
|
||||
|
||||
const data = {
|
||||
address: {
|
||||
city: "Bochnia",
|
||||
country_iso: "pl",
|
||||
name: "John",
|
||||
postcode: "32-700",
|
||||
street: "Karosek",
|
||||
surname: "Kornelsky",
|
||||
},
|
||||
address_id: 2,
|
||||
alias: "home",
|
||||
customer_id: 4,
|
||||
is_default: true,
|
||||
is_official: false,
|
||||
};
|
||||
const { data } = await useMyFetch<GenericResponse<UserAddressOfficial>>(
|
||||
`/api/restricted/user/address/official`,
|
||||
{
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
onErrorOccured: async (_, status) => {
|
||||
throw createError({
|
||||
statusCode: status,
|
||||
statusMessage: `HTTP error: ${status}`,
|
||||
});
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
userName.value = data.address.name;
|
||||
lastName.value = data.address.surname;
|
||||
address.value = data.address.street;
|
||||
postCode.value = data.address.postcode;
|
||||
city.value = data.address.city;
|
||||
country.value = data.address.country_iso;
|
||||
// resolve this
|
||||
// accountPhoneNumber.value = useUserStore().fullUserData.phone_number;
|
||||
phoneNumber.value = "+36 789 3773 737";
|
||||
country.value = data.address.country.country_lang[0].name;
|
||||
} catch (error) {
|
||||
console.error("restrictedAddressOfficial error:", error);
|
||||
console.error("getUserData error:", error);
|
||||
}
|
||||
}
|
||||
|
||||
// upload new address
|
||||
const vNewAddressName = ref("");
|
||||
const vNewAddressSurname = ref("");
|
||||
const vNewAddressAddress = ref("");
|
||||
const vNewAddressCode = ref("");
|
||||
const vNewAddressCity = ref("");
|
||||
const vNewAddressCountry = ref("");
|
||||
const vNewAddressCountry = ref();
|
||||
const vUseAccountPhoneNumber = ref(false);
|
||||
const isOpen = ref<boolean>(false);
|
||||
async function uploadAddress() {
|
||||
try {
|
||||
const res = await useMyFetch<GenericResponse<object>>(
|
||||
`/api/restricted/user/address/official`,
|
||||
`/api/restricted/user/address`,
|
||||
{
|
||||
method: "POST",
|
||||
headers: {
|
||||
@ -125,7 +93,7 @@ export const useCheckoutStore = defineStore("checkoutStore", () => {
|
||||
body: JSON.stringify({
|
||||
address: {
|
||||
city: vNewAddressCity.value,
|
||||
// country_iso: vNewAddressCountry.value?.iso_code,
|
||||
country_iso: vNewAddressCountry.value.iso_code,
|
||||
name: vNewAddressName.value,
|
||||
postcode: vNewAddressCode.value,
|
||||
street: vNewAddressAddress.value,
|
||||
@ -147,7 +115,7 @@ export const useCheckoutStore = defineStore("checkoutStore", () => {
|
||||
dangerouslyHTMLString: true,
|
||||
});
|
||||
isOpen.value = false;
|
||||
restrictedAddress();
|
||||
getAddressList();
|
||||
} else {
|
||||
$toast.error("Failed to add address. Please try again.", {
|
||||
autoClose: 5000,
|
||||
@ -159,23 +127,32 @@ export const useCheckoutStore = defineStore("checkoutStore", () => {
|
||||
}
|
||||
}
|
||||
|
||||
const currentPrefix = ref<string | number>("+43");
|
||||
const changePrefix = (item: any) => {
|
||||
const currentPrefix = ref<string | number>(
|
||||
menuStore.selectedCountry.call_prefix
|
||||
);
|
||||
const changePrefix = (item: string) => {
|
||||
currentPrefix.value = item;
|
||||
};
|
||||
const phoneValidation = ref<boolean | null>(null);
|
||||
|
||||
const userStore = useUserStore();
|
||||
// send form
|
||||
async function sendForm() {
|
||||
let phoneNum = `${currentPrefix.value}${phoneNumber.value}`
|
||||
.replaceAll(" ", "")
|
||||
.trim();
|
||||
let phoneNum = vUseAccountPhoneNumber.value
|
||||
? accountPhoneNumber.value
|
||||
: `${currentPrefix.value}${phoneNumber.value}`.replaceAll(" ", "").trim();
|
||||
// if (vUseAccountPhoneNumber.value) {
|
||||
// phoneNum = phoneNumber.value;
|
||||
// }
|
||||
|
||||
phoneValidation.value = validation(phoneNum, 1, 49, REGEX_PHONE);
|
||||
if (!phoneValidation.value && !vUseAccountPhoneNumber.value) {
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const res = await useMyFetch<GenericResponse<object>>(
|
||||
`restricted/cart/checkout/delivery`,
|
||||
`/api/restricted/cart/checkout/delivery`,
|
||||
{
|
||||
method: "PUT",
|
||||
headers: {
|
||||
@ -191,7 +168,7 @@ export const useCheckoutStore = defineStore("checkoutStore", () => {
|
||||
surname: activeAddress.value?.address.surname,
|
||||
},
|
||||
phone_number: phoneNum,
|
||||
// email: useUserStore().fullUserData.email,
|
||||
email: userStore.fullUserData?.email,
|
||||
}),
|
||||
onErrorOccured: async (_, status) => {
|
||||
throw createError({
|
||||
@ -223,10 +200,34 @@ export const useCheckoutStore = defineStore("checkoutStore", () => {
|
||||
activeAddress.value = item;
|
||||
};
|
||||
|
||||
async function getCheckout() {
|
||||
try {
|
||||
const res = await useMyFetch<GenericResponse<object>>(
|
||||
`/api/restricted/cart/checkout`,
|
||||
{
|
||||
method: "PUT",
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
onErrorOccured: async (_, status) => {
|
||||
throw createError({
|
||||
statusCode: status,
|
||||
statusMessage: `HTTP error: ${status}`,
|
||||
});
|
||||
},
|
||||
}
|
||||
);
|
||||
} catch (error) {
|
||||
console.error("uploadAddress error:", error);
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
addressesList,
|
||||
activeAddress,
|
||||
isOpen,
|
||||
selectedIso,
|
||||
phoneValidation,
|
||||
|
||||
userName,
|
||||
lastName,
|
||||
@ -246,8 +247,10 @@ export const useCheckoutStore = defineStore("checkoutStore", () => {
|
||||
vNewAddressCity,
|
||||
vNewAddressCountry,
|
||||
|
||||
restrictedAddress,
|
||||
restrictedAddressOfficial,
|
||||
changePrefix,
|
||||
getCheckout,
|
||||
getAddressList,
|
||||
getUserData,
|
||||
changeActive,
|
||||
uploadAddress,
|
||||
sendForm,
|
||||
|
||||
@ -3,6 +3,10 @@ import type { Customer } from "~/types/user";
|
||||
|
||||
export const useUserStore = defineStore("userStore", () => {
|
||||
const store = useStore();
|
||||
const menuStore = useMenuStore();
|
||||
const checkoutStore = useCheckoutStore();
|
||||
|
||||
const { $toast } = useNuxtApp();
|
||||
|
||||
const fullUserData = ref<Customer | null>(null);
|
||||
const isLogged = ref<boolean>(true);
|
||||
@ -10,28 +14,26 @@ export const useUserStore = defineStore("userStore", () => {
|
||||
|
||||
async function checkIsLogged() {
|
||||
try {
|
||||
const { data } = await useMyFetch<
|
||||
GenericResponse<{ loggedin: boolean } | Customer>
|
||||
>(`/api/public/user`, {
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
onErrorOccured: async (_, status) => {
|
||||
throw createError({
|
||||
statusCode: status,
|
||||
statusMessage: `HTTP error: ${status}`,
|
||||
});
|
||||
},
|
||||
});
|
||||
const { data } = await useMyFetch<GenericResponse<Customer>>(
|
||||
`/api/public/user`,
|
||||
{
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
onErrorOccured: async (_, status) => {
|
||||
throw createError({
|
||||
statusCode: status,
|
||||
statusMessage: `HTTP error: ${status}`,
|
||||
});
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
if ("loggedin" in data && data.loggedin === true) {
|
||||
isLogged.value = true;
|
||||
user.value = null;
|
||||
fullUserData.value = null;
|
||||
} else if ("first_name" in data && "last_name" in data) {
|
||||
isLogged.value = true;
|
||||
user.value = `${data.first_name} ${data.last_name}`;
|
||||
fullUserData.value = data as Customer;
|
||||
user.value = `${data.first_name} ${data.last_name}` as any;
|
||||
fullUserData.value = data;
|
||||
checkoutStore.accountPhoneNumber = fullUserData.value.phone_number;
|
||||
} else {
|
||||
isLogged.value = false;
|
||||
user.value = null;
|
||||
@ -48,7 +50,6 @@ export const useUserStore = defineStore("userStore", () => {
|
||||
const vLogin = ref<boolean>(true);
|
||||
const vCodeVerify = ref<boolean>(false);
|
||||
const vCode = ref<number | null>(null);
|
||||
const vEmail = ref<string>("");
|
||||
async function logIn() {
|
||||
try {
|
||||
const data = await useMyFetch<GenericResponse<object>>(
|
||||
@ -71,35 +72,77 @@ export const useUserStore = defineStore("userStore", () => {
|
||||
if (data.status === 200 || data.status === 201) {
|
||||
console.log(vCodeVerify.value);
|
||||
|
||||
// $toast.success("Address successfully added", {
|
||||
// autoClose: 5000,
|
||||
// dangerouslyHTMLString: true,
|
||||
// });
|
||||
$toast.success("Code successfully sent to your email", {
|
||||
autoClose: 5000,
|
||||
dangerouslyHTMLString: true,
|
||||
});
|
||||
vLogin.value = false;
|
||||
vCodeVerify.value = true;
|
||||
} else {
|
||||
$toast.error("Failed to sent code to your email. Please try again.", {
|
||||
autoClose: 5000,
|
||||
dangerouslyHTMLString: true,
|
||||
});
|
||||
}
|
||||
// else {
|
||||
// $toast.error("Failed to add address. Please try again.", {
|
||||
// autoClose: 5000,
|
||||
// dangerouslyHTMLString: true,
|
||||
// });
|
||||
// }
|
||||
|
||||
store.minValue = data;
|
||||
} catch (error) {
|
||||
console.error("getList error:", error);
|
||||
}
|
||||
}
|
||||
|
||||
const sendFormCode = async (redirect?: boolean) => {
|
||||
try {
|
||||
const data = await useMyFetch<GenericResponse<object>>(
|
||||
`/api/public/user/session/confirm`,
|
||||
{
|
||||
method: "POST",
|
||||
body: JSON.stringify({
|
||||
code: vCode.value,
|
||||
mail: email.value,
|
||||
}),
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
onErrorOccured: (_, status) => {
|
||||
throw new Error(`HTTP error: ${status}`);
|
||||
},
|
||||
}
|
||||
);
|
||||
|
||||
await checkIsLogged();
|
||||
|
||||
if (isLogged.value) {
|
||||
if (redirect) {
|
||||
console.log(isLogged.value);
|
||||
menuStore.navigateToItem();
|
||||
} else {
|
||||
// window.location.href = atob(redirect);
|
||||
}
|
||||
} else {
|
||||
useNuxtApp().$toast.error(`Error occurred: Failed to confirm code`, {
|
||||
autoClose: 5000,
|
||||
dangerouslyHTMLString: true,
|
||||
});
|
||||
}
|
||||
} catch (e) {
|
||||
useNuxtApp().$toast.error(`Invalid code provided`, {
|
||||
autoClose: 5000,
|
||||
dangerouslyHTMLString: true,
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
return {
|
||||
isLogged,
|
||||
user,
|
||||
fullUserData,
|
||||
vCodeVerify,
|
||||
vCode,
|
||||
vEmail,
|
||||
email,
|
||||
password,
|
||||
logIn,
|
||||
checkIsLogged,
|
||||
sendFormCode,
|
||||
};
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user