step1 wallet card adjust

This commit is contained in:
arcbtc
2024-12-18 20:53:55 +00:00
parent 3dd1c6992b
commit ce9b63c54e

View File

@@ -34,31 +34,111 @@
} : ''"
>
<q-card-section>
<h3 class="q-my-none text-no-wrap">
<strong v-text="formattedBalance"></strong>
<small> {{LNBITS_DENOMINATION}}</small>
<lnbits-update-balance
:wallet_id="this.g.wallet.id"
@credit-value="handleBalanceUpdate"
class="q-ml-md"
></lnbits-update-balance>
</h3>
<div class="row">
<div class="col">
<div v-if="g.wallet.currency">
<div class="col-1" style="max-width: 30px">
<q-btn
v-if="g.wallet.currency"
@click="swapBalancePriority"
style="height: 50px"
class="q-mt-lg"
flat
dense
icon="swap_vert"
></q-btn>
</div>
<div class="col-11">
<div
class="column"
v-if="!isPrioritySwapped"
style="height: 100px"
>
<div class="col-7">
<div class="row">
<div class="col-auto">
<div class="text-h3 q-my-none text-no-wrap">
<strong v-text="formattedBalance"></strong>
<small> {{LNBITS_DENOMINATION}}</small>
</div>
</div>
<div class="col-auto">
<lnbits-update-balance
v-if="$q.screen.lt.lg"
:wallet_id="this.g.wallet.id"
:callback="updateBalanceCallback"
:small_btn="true"
></lnbits-update-balance>
</div>
</div>
</div>
<div class="col-2">
<div v-if="g.wallet.currency && fiatTracking">
<span
class="text-h5 text-italic"
v-text="formattedFiatAmount"
style="opacity: 0.75"
></span>
</div>
</div>
</div>
<div
class="column"
v-if="isPrioritySwapped && fiatTracking"
style="height: 100px"
>
<div class="col-7">
<div class="row">
<div class="col-auto">
<div
v-if="g.wallet.currency"
class="text-h3 q-my-none text-no-wrap"
>
<strong
v-text="formattedFiatAmount"
></strong>
</div>
</div>
<div class="col-auto">
<lnbits-update-balance
v-if="$q.screen.lt.lg"
:wallet_id="this.g.wallet.id"
:callback="updateBalanceCallback"
:small_btn="true"
></lnbits-update-balance>
</div>
</div>
</div>
<div class="col-2">
<span
class="text-h5 text-italic"
style="opacity: 0.75"
v-text="formattedBalance + ' {{LNBITS_DENOMINATION}}'"
>
</span>
</div>
</div>
<div class="absolute-right q-pa-md" v-if="$q.screen.gt.md && g.wallet.currency && fiatTracking">
<div class="text-bold text-italic">
BTC Price
<span
:class="{'text-positive q-pl-xs': priceChange > 0, 'text-negative q-pl-xs': priceChange < 0}"
v-text="priceChange"
></span>
</div>
<span
class="text-h5 text-italic"
v-text="formattedFiatBalance"
style="opacity: 0.75"
class="text-bold text-italic"
v-text="formattedExchange"
></span>
</div>
</div>
<div class="col">
<q-btn
v-if="$q.screen.lt.md"
@click="mobileSimple = !mobileSimple"
color="primary"
class="float-right lt-md"
class="q-ml-xl absolute-right"
dense
size="sm"
style="height: 20px; margin-top: 75px"
flat
:icon="mobileSimple ? 'unfold_more' : 'unfold_less'"
:label="mobileSimple ? $t('more') : $t('less')"
@@ -71,7 +151,7 @@
<q-btn
unelevated
color="primary"
class="full-width"
class="q-mr-md"
@click="showParseDialog"
:label="$t('paste_request')"
></q-btn>
@@ -80,7 +160,7 @@
<q-btn
unelevated
color="primary"
class="full-width"
class="q-mr-md"
@click="showReceiveDialog"
:label="$t('create_invoice')"
></q-btn>
@@ -89,14 +169,19 @@
<q-btn
unelevated
color="secondary"
icon="photo_camera"
@click="showCamera"
icon="qr_code_scanner"
:label="$t('scan')"
>
<q-tooltip
><span v-text="$t('camera_tooltip')"></span
></q-tooltip>
</q-btn>
<lnbits-update-balance
v-if="$q.screen.gt.md"
:wallet_id="this.g.wallet.id"
:callback="updateBalanceCallback"
:small_btn="false"
></lnbits-update-balance>
</div>
</div>
</q-card>