mohadese namavar
73 lines
1.8 KiB
Vue
73 lines
1.8 KiB
Vue
<template>
|
|
<div class="seller-details-best-selling">
|
|
<div>
|
|
<Button icon="isax isax-close-circle" severity="secondary" rounded link @click="dialog.close()" />
|
|
<h2>{{ title }}</h2>
|
|
<img :src="coverImage">
|
|
</div>
|
|
<ul>
|
|
<li v-for="(value, key ) in items" :key="key">
|
|
<label>{{ $t(key) }}</label>
|
|
<span>{{ value }}</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
const dialog = inject('dialogRef')
|
|
const { product, quantity, total } = dialog.value.data
|
|
const { title, coverImagem, stockQuantity} = product
|
|
|
|
const numberFormat = (number) =>
|
|
new Intl.NumberFormat('fa-IR', { maximumSignificantDigits: 3 }).format(number)
|
|
|
|
const items = reactive({
|
|
salesNumber: quantity,
|
|
salesPrice: numberFormat(total),
|
|
inventory: stockQuantity,
|
|
status: "دارای رقیب",
|
|
})
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.seller-details-best-selling {
|
|
@apply flex flex-col bg-white rounded-t-[0.6rem] gap-[1.9rem] px-6 py-[1.1rem] rtl;
|
|
|
|
&>div {
|
|
@apply flex gap-1.5;
|
|
|
|
h2 {
|
|
@apply w-56 text-[#333333] text-sm font-medium font-vazir pt-0.5;
|
|
}
|
|
|
|
button {
|
|
@apply -mx-4 -my-3;
|
|
|
|
.p-button-icon {
|
|
@apply text-lg text-[#B2B2B2] #{!important};
|
|
}
|
|
}
|
|
|
|
img {
|
|
@apply w-[3.8rem] h-[3.8rem] mr-auto;
|
|
}
|
|
}
|
|
|
|
&>ul {
|
|
@apply flex flex-col gap-[1.1rem] mt-1.5;
|
|
|
|
li {
|
|
@apply flex justify-between;
|
|
|
|
label {
|
|
@apply text-[#5D5D5D] text-xs font-vazir
|
|
}
|
|
|
|
span {
|
|
@apply text-[#333333] text-xs font-medium font-vazir;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style> |