32 lines
1015 B
Vue
32 lines
1015 B
Vue
<script setup lang="ts">
|
||
import { useProductPrice } from '../model'
|
||
import { InputNumber } from '~/src/shared/ui'
|
||
import type { CrmVariant } from '~/src/shared/model'
|
||
|
||
const props = defineProps<{
|
||
variants: CrmVariant[]
|
||
productId: string
|
||
}>()
|
||
|
||
const { amount, currentUnitPrice, prevUnitPrice } = useProductPrice(props.variants, props.productId)
|
||
</script>
|
||
|
||
<template>
|
||
<div class="bg-gray-50 rounded-2xl border border-slate-200 flex gap-5 justify-between p-5 items-center">
|
||
<div class="flex flex-col gap-1 flex-1">
|
||
<div class="text-2xl font-bold" :class="{ 'text-pink-800': prevUnitPrice }">
|
||
{{ currentUnitPrice }} ₽
|
||
</div>
|
||
<div v-if="prevUnitPrice" class="line-through text-slate-400">
|
||
{{ prevUnitPrice }} ₽
|
||
</div>
|
||
</div>
|
||
<div class="flex-1">
|
||
<UButton v-if="!amount" class="w-full justify-center" size="xl" @click="amount = 1">
|
||
В корзину
|
||
</UButton>
|
||
<InputNumber v-else v-model="amount" />
|
||
</div>
|
||
</div>
|
||
</template>
|