mohadese namavar
62 lines
1.9 KiB
Vue
62 lines
1.9 KiB
Vue
<template>
|
|
<div class="seller-management">
|
|
<h2>{{ $t(title + 'Mangement') }}</h2>
|
|
<ul>
|
|
<li v-for="(item, i) in items[title]" :key="i">
|
|
<small>{{ item.label }}</small>
|
|
<span>{{ item.value }}</span>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup>
|
|
const props = defineProps(['title'])
|
|
|
|
const {
|
|
itemHighStock, zeroStock, returnedProducts, itemLowStock,
|
|
oneWeekAgo, oneDayAgo, pendingProducts = [], receivedProducts,
|
|
} = inject('data')
|
|
|
|
const items = reactive({
|
|
warehouse: [
|
|
{ label: 'کالاهای موجود', value: itemHighStock },
|
|
{ label: 'کالاهای بدون موجودی', value: zeroStock },
|
|
{ label: 'کالاهای مرجوعی یک هفته گذشته', value: returnedProducts },
|
|
{ label: 'کالاهای در حال اتمام موجودی', value: itemLowStock },
|
|
],
|
|
orders: [
|
|
{ label: 'سفارشات این هفته', value: oneWeekAgo },
|
|
{ label: 'سفارش های امروز', value: oneDayAgo },
|
|
{ label: 'سفارش های پذیرش نشده', value: pendingProducts.length },
|
|
{ label: 'سفارش های ارسال شده', value: receivedProducts },
|
|
]
|
|
})
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.seller-management {
|
|
@apply w-full md:w-[21.4rem] lg:w-[28.1rem] flex flex-col pt-[1.1rem] gap-[1.1rem] lg:pt-5 lg:gap-5 rounded-[0.6rem] border-2 border-neutral-200;
|
|
|
|
h2 {
|
|
@apply text-[#333333] text-sm lg:text-lg font-medium font-vazir pr-[1.1rem] lg:pr-5;
|
|
}
|
|
|
|
ul {
|
|
@apply w-full flex flex-col gap-6 lg:gap-[1.9rem] p-[1.1rem] lg:pt-6 border-t border-[#E5E5E5];
|
|
|
|
li {
|
|
@apply flex justify-between items-center text-[#333333] font-medium font-vazir;
|
|
|
|
small {
|
|
@apply text-xs lg:text-base;
|
|
}
|
|
|
|
span {
|
|
@apply text-sm lg:text-xl;
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
</style> |