<script setup lang="ts">
import TierPricesPanel from './TierPricesPanel.vue';

const tiers = [
    { tier_no: 1, leads_in_tier: 50, price_rub: '120.00' },
    { tier_no: 2, leads_in_tier: 100, price_rub: '100.00' },
    { tier_no: 3, leads_in_tier: 200, price_rub: '80.00' },
    { tier_no: 4, leads_in_tier: 300, price_rub: '70.00' },
    { tier_no: 5, leads_in_tier: 400, price_rub: '65.00' },
    { tier_no: 6, leads_in_tier: 500, price_rub: '62.00' },
    { tier_no: 7, leads_in_tier: null, price_rub: '60.00' },
];
</script>

<template>
    <Story title="Billing/TierPricesPanel">
        <Variant title="Текущая ступень: 1"><TierPricesPanel :tiers="tiers" :current-tier-no="1" /></Variant>
        <Variant title="Текущая ступень: 3"><TierPricesPanel :tiers="tiers" :current-tier-no="3" /></Variant>
        <Variant title="Текущая ступень: 7 (всё свыше)"
            ><TierPricesPanel :tiers="tiers" :current-tier-no="7"
        /></Variant>
        <Variant title="Без current_tier"><TierPricesPanel :tiers="tiers" :current-tier-no="null" /></Variant>
    </Story>
</template>
