add: reactive store

Add useLocalStorage from VueUse
This commit is contained in:
Fiona Lena Urban 2025-05-10 14:32:40 +02:00
parent 27f051cf14
commit 9498911e7a
4 changed files with 81 additions and 98 deletions

View file

@ -33,21 +33,21 @@
<div class="info flex-col">
<div class="price">
<Icon class="icon" name="uil:toilet-paper" mode="svg" />
<span class="value">{{ intl.format(card.ppr) }}</span>
<span class="value">{{ intl.format(ppr) }}</span>
</div>
<span class="pro">Pro 1 {{ card.roles ? `(${card.roles})` : '' }}</span>
</div>
<div class="info flex-col">
<div class="price">
<Icon class="icon" name="uil:file-landscape" mode="svg" />
<span class="value">{{ intl.format(card.pps) }}</span>
<span class="value">{{ intl.format(pps) }}</span>
</div>
<span class="pro">Pro 100 {{ card.sheets ? `(${card.sheets})` : '' }}</span>
</div>
<div class="info flex-col">
<div class="price">
<Icon class="icon" name="uil:layer-group" mode="svg" />
<span class="value">{{ intl.format(card.ppl) }}</span>
<span class="value">{{ intl.format(ppl) }}</span>
</div>
<span class="pro">Pro 100 {{ card.layers ? `(${card.layers})` : '' }}</span>
</div>
@ -92,7 +92,17 @@ const { lengthX, direction, isSwiping } = useSwipe(top, {
},
})
const priceClean = computed<number>(() => +replaceComma(card.price))
const ppr = computed(() => priceClean.value / +card.roles)
const pps = computed(() => (ppr.value / +card.sheets) * 100)
const ppl = computed(() => (pps.value / +card.layers))
const update = () => emit('update')
const deleteCard = () => emit('remove')
defineExpose({
ppr, pps, ppl, uuid : card.uuid,
})
</script>

View file

@ -83,7 +83,6 @@ const { currentCardIndex, currentCard } = defineProps<Props>()
const emit = defineEmits(['update'])
const dialog = useTemplateRef<HTMLDialogElement>('dialog')
const cardLabel = computed(() => currentCardIndex > -1 ? 'Bearbeiten' : 'Hinzufügen')
const checkPrice = () => {
if (!currentCard) { return false }