mohadese-nm
86 lines
1.9 KiB
Vue
86 lines
1.9 KiB
Vue
<template>
|
|
<div class="cart-total-aside">
|
|
<ul>
|
|
<li v-for="(value, key) in items" :key="key">
|
|
<label>{{ $t(key) }}</label>
|
|
<span>
|
|
{{ numberFormat(value) }}
|
|
{{ key == "productsCount" ? $t("product") : "" }}
|
|
</span>
|
|
</li>
|
|
</ul>
|
|
<Button
|
|
:label="$t('submitAndViewPreFactor')"
|
|
:loading="loading"
|
|
@click="submitOrder()"
|
|
/>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
import init from "../../../initialize/cart-total-invoice";
|
|
const { dialog } = inject("service");
|
|
const data = inject("data");
|
|
|
|
const items = computed(() => init(data.value));
|
|
|
|
const token = useCookie("token");
|
|
|
|
const router = useRouter();
|
|
|
|
const loading = ref(false);
|
|
|
|
const submitOrder = async () => {
|
|
if (token.value) {
|
|
loading.value = true;
|
|
const { status, data: res } = await useFetch("/api/orders", {
|
|
headers: { Authorization: useCookie("token") },
|
|
method: "post",
|
|
});
|
|
loading.value = false;
|
|
|
|
if (status.value == "success") {
|
|
dialog.show(resolveComponent("CartDialogPreFactor"), res.value);
|
|
const cart = useCartStore();
|
|
cart.get();
|
|
}
|
|
} else router.push("/auth/login?redirect=/checkout/cart");
|
|
};
|
|
|
|
const numberFormat = (number) =>
|
|
new Intl.NumberFormat("fa-IR", { maximumSignificantDigits: 3 }).format(
|
|
number
|
|
);
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.cart-total-aside {
|
|
@apply w-full lg:max-w-[28.1rem] lg:h-[25rem] flex flex-col justify-between p-6 grow;
|
|
@apply lg:bg-neutral-50 lg:rounded-[0.6rem] lg:border border-neutral-200 font-vazir lg:mr-auto;
|
|
|
|
ul {
|
|
@apply flex flex-col gap-[1.1rem] lg:gap-6 lg:mt-2;
|
|
|
|
li {
|
|
@apply flex justify-between items-center;
|
|
|
|
label {
|
|
@apply text-zinc-500 text-sm lg:text-xl font-medium;
|
|
}
|
|
|
|
span {
|
|
@apply text-zinc-800 text-lg lg:text-2xl lg:font-medium;
|
|
}
|
|
}
|
|
}
|
|
|
|
button {
|
|
@apply max-lg:hidden;
|
|
|
|
span {
|
|
@apply text-xl font-bold;
|
|
}
|
|
}
|
|
}
|
|
</style>
|