b-modal#buy-modal(
:visible="true",
v-if="item != null",
:hide-header="true",
@change="onChange($event)"
)
span.badge.badge-pill.badge-dialog(
:class="{'item-selected-badge': item.pinned}",
v-if="withPin",
@click.prevent.stop="togglePinned()"
)
span.svg-icon.inline.color.icon-10(v-html="icons.pin")
div.close
span.svg-icon.inline.icon-10(aria-hidden="true", v-html="icons.close", @click="hideDialog()")
div.content(v-if="item != null")
div.inner-content
slot(name="item", :item="item")
h4.title {{ itemText }}
div.text(v-html="itemNotes")
slot(name="additionalInfo", :item="item")
div(:class="{'notEnough': !this.enoughCurrency(getPriceClass(), item.value)}")
span.svg-icon.inline.icon-32(aria-hidden="true", v-html="icons[getPriceClass()]")
span.value(:class="getPriceClass()") {{ item.value }}
button.btn.btn-primary(
@click="purchaseGems()",
v-if="getPriceClass() === 'gems' && !this.enoughCurrency(getPriceClass(), item.value)"
) {{ $t('purchaseGems') }}
button.btn.btn-primary(
@click="buyItem()",
v-else,
:class="{'notEnough': !this.enoughCurrency(getPriceClass(), item.value)}"
) {{ $t('buyNow') }}
div.clearfix(slot="modal-footer")
span.balance.float-left {{ $t('yourBalance') }}
balanceInfo(
:withHourglass="getPriceClass() === 'hourglasses'",
:currencyNeeded="getPriceClass()",
:amountNeeded="item.value"
).float-right