<template>
  <view class="price-text">
    <text class="currency">¥</text>
    <text class="amount">{{ displayPrice }}</text>
    <text v-if="originalPrice" class="original">{{ formattedOriginal }}</text>
  </view>
</template>

<script lang="uts">
export default {
  props: {
    price: { type: Number, default: 0 },
    originalPrice: { type: Number, default: 0 }
  },
  computed: {
    displayPrice() { return (this.price || 0).toFixed(2) },
    formattedOriginal() { return '¥' + (this.originalPrice || 0).toFixed(2) }
  }
}
</script>

<style scoped>
.price-text { display:flex; align-items:baseline }
.currency { font-size:20rpx; color:#ff4d4f; margin-right:6rpx }
.amount { font-size:34rpx; color:#ff4d4f; font-weight:700 }
.original { font-size:22rpx; color:#999; text-decoration:line-through; margin-left:8rpx }
</style>
