Files
anahita-front/components/cart/total/Aside.vue
T
mohadese namavar ec84dfd222 init git
2024-06-16 00:22:14 +04:30

74 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 loading = ref(false)
const submitOrder = async () => {
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()
}
}
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>