scrolling works
This commit is contained in:
parent
4c38bcbcf3
commit
b936d122a3
|
@ -110,5 +110,6 @@ LNTIPS_API_KEY=LNTIPS_ADMIN_KEY
|
||||||
LNTIPS_API_ENDPOINT=https://ln.tips
|
LNTIPS_API_ENDPOINT=https://ln.tips
|
||||||
|
|
||||||
# Cashu Mint
|
# Cashu Mint
|
||||||
# Use a long-enough random (!) private key
|
# Use a long-enough random (!) private key.
|
||||||
|
# Once set, you cannot change this key as for now.
|
||||||
CASHU_PRIVATE_KEY="SuperSecretPrivateKey"
|
CASHU_PRIVATE_KEY="SuperSecretPrivateKey"
|
||||||
|
|
|
@ -5,305 +5,307 @@ page_container %}
|
||||||
<q-page>
|
<q-page>
|
||||||
<div class="row q-col-gutter-md justify-center q-pt-lg">
|
<div class="row q-col-gutter-md justify-center q-pt-lg">
|
||||||
<div class="col-12 col-sm-8 col-md-9 col-lg-7 text-center q-gutter-y-md">
|
<div class="col-12 col-sm-8 col-md-9 col-lg-7 text-center q-gutter-y-md">
|
||||||
<q-scroll-area :style="'height: ' + height + 'px; max-width: 1024px'">
|
<q-card class="q-mb-sm">
|
||||||
<q-card class="q-mb-sm">
|
<q-card-section>
|
||||||
<q-card-section>
|
<div class="gt-sm">
|
||||||
<div class="gt-sm">
|
<div class="row">
|
||||||
<div class="row">
|
<div class="col-3 q-pt-sm">
|
||||||
<div class="col-3 q-pt-sm">
|
|
||||||
<q-btn
|
|
||||||
class="full-width"
|
|
||||||
size="14px"
|
|
||||||
icon="bolt"
|
|
||||||
rectangle
|
|
||||||
color="primary"
|
|
||||||
@click="showInvoicesDialog"
|
|
||||||
><strong>Get invoice</strong>
|
|
||||||
</q-btn>
|
|
||||||
</div>
|
|
||||||
<div class="col-6">
|
|
||||||
<h3 class="q-my-none q-py-none">
|
|
||||||
<center>
|
|
||||||
<strong>{% raw %} {{getBalance()}} </strong>
|
|
||||||
{{tickershort}}{% endraw %}
|
|
||||||
</center>
|
|
||||||
</h3>
|
|
||||||
</div>
|
|
||||||
<div class="col-3 q-pt-sm">
|
|
||||||
<q-btn
|
|
||||||
class="full-width"
|
|
||||||
@click="showParseDialog"
|
|
||||||
size="14px"
|
|
||||||
icon="bolt"
|
|
||||||
rectangle
|
|
||||||
color="primary"
|
|
||||||
class="full-width"
|
|
||||||
><strong>Pay invoice</strong>
|
|
||||||
</q-btn>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="lt-md">
|
|
||||||
<div class="row">
|
|
||||||
<div class="col-12">
|
|
||||||
<h3 class="q-my-none q-py-none">
|
|
||||||
<center>
|
|
||||||
<strong>{% raw %} {{getBalance()}} </strong>
|
|
||||||
{{tickershort}}{% endraw %}
|
|
||||||
</center>
|
|
||||||
</h3>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</q-card-section>
|
|
||||||
</q-card>
|
|
||||||
|
|
||||||
<q-card>
|
|
||||||
<q-card-section>
|
|
||||||
<div class="row items-center no-wrap q-mb-sm">
|
|
||||||
<div class="col-6 col-sm-5 col-md-4 q-px-xs">
|
|
||||||
<q-btn
|
<q-btn
|
||||||
size="12px"
|
|
||||||
rectangle
|
|
||||||
unelevated
|
|
||||||
color="primary"
|
|
||||||
icon="file_download"
|
|
||||||
class="full-width"
|
class="full-width"
|
||||||
@click="showReceiveTokensDialog"
|
size="14px"
|
||||||
>Get Ecash</q-btn
|
icon="bolt"
|
||||||
>
|
rectangle
|
||||||
|
color="primary"
|
||||||
|
@click="showInvoicesDialog"
|
||||||
|
><strong>Get invoice</strong>
|
||||||
|
</q-btn>
|
||||||
</div>
|
</div>
|
||||||
<div class="col-0 col-sm-2 col-md-4"></div>
|
<div class="col-6">
|
||||||
<div class="col-6 col-sm-5 col-md-4 q-px-xs">
|
<h3 class="q-my-none q-py-none">
|
||||||
|
<center>
|
||||||
|
<strong>{% raw %} {{getBalance()}} </strong>
|
||||||
|
{{tickershort}}{% endraw %}
|
||||||
|
</center>
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
|
<div class="col-3 q-pt-sm">
|
||||||
<q-btn
|
<q-btn
|
||||||
size="12px"
|
|
||||||
rectangle
|
|
||||||
unelevated
|
|
||||||
color="primary"
|
|
||||||
icon="file_upload"
|
|
||||||
class="full-width"
|
class="full-width"
|
||||||
@click="showSendTokensDialog"
|
@click="showParseDialog"
|
||||||
>
|
size="14px"
|
||||||
Pay Ecash</q-btn
|
icon="bolt"
|
||||||
>
|
rectangle
|
||||||
|
color="primary"
|
||||||
|
class="full-width"
|
||||||
|
><strong>Pay invoice</strong>
|
||||||
|
</q-btn>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="lt-md">
|
||||||
|
<div class="row">
|
||||||
|
<div class="col-12">
|
||||||
|
<h3 class="q-my-none q-py-none">
|
||||||
|
<center>
|
||||||
|
<strong>{% raw %} {{getBalance()}} </strong>
|
||||||
|
{{tickershort}}{% endraw %}
|
||||||
|
</center>
|
||||||
|
</h3>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</q-card-section>
|
||||||
|
</q-card>
|
||||||
|
|
||||||
<!-- ///////////////////////////////////////////
|
<q-card>
|
||||||
|
<q-card-section>
|
||||||
|
<div class="row items-center no-wrap q-mb-sm">
|
||||||
|
<div class="col-6 col-sm-5 col-md-4 q-px-xs">
|
||||||
|
<q-btn
|
||||||
|
size="12px"
|
||||||
|
rectangle
|
||||||
|
unelevated
|
||||||
|
color="primary"
|
||||||
|
icon="file_download"
|
||||||
|
class="full-width"
|
||||||
|
@click="showReceiveTokensDialog"
|
||||||
|
>Get Ecash</q-btn
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<div class="col-0 col-sm-2 col-md-4"></div>
|
||||||
|
<div class="col-6 col-sm-5 col-md-4 q-px-xs">
|
||||||
|
<q-btn
|
||||||
|
size="12px"
|
||||||
|
rectangle
|
||||||
|
unelevated
|
||||||
|
color="primary"
|
||||||
|
icon="file_upload"
|
||||||
|
class="full-width"
|
||||||
|
@click="showSendTokensDialog"
|
||||||
|
>
|
||||||
|
Pay Ecash</q-btn
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- ///////////////////////////////////////////
|
||||||
////////////////// TABLES /////////////////
|
////////////////// TABLES /////////////////
|
||||||
/////////////////////////////////////////// -->
|
/////////////////////////////////////////// -->
|
||||||
<q-tabs v-model="tab" no-caps class="bg-dark text-white shadow-2">
|
<q-tabs v-model="tab" no-caps class="bg-dark text-white shadow-2">
|
||||||
<q-tab name="tokens" label="Tokens"></q-tab>
|
<q-tab name="tokens" label="Tokens"></q-tab>
|
||||||
<q-tab name="invoices" label="Invoices"></q-tab>
|
<q-tab name="invoices" label="Invoices"></q-tab>
|
||||||
<q-tab name="history" label="History"></q-tab>
|
<q-tab name="history" label="History"></q-tab>
|
||||||
</q-tabs>
|
</q-tabs>
|
||||||
<q-tab-panels v-model="tab">
|
<q-tab-panels v-model="tab">
|
||||||
<!-- ////////////////// TOKEN LIST ///////////////// -->
|
<!-- ////////////////// TOKEN LIST ///////////////// -->
|
||||||
|
|
||||||
<q-tab-panel name="tokens">
|
<q-tab-panel name="tokens">
|
||||||
<q-table
|
<q-table
|
||||||
dense
|
dense
|
||||||
flat
|
flat
|
||||||
:data="getTokenList()"
|
:data="getTokenList()"
|
||||||
:columns="tokensTable.columns"
|
:columns="tokensTable.columns"
|
||||||
:pagination.sync="tokensTable.pagination"
|
:pagination.sync="tokensTable.pagination"
|
||||||
no-data-label="No tokens yet"
|
no-data-label="No tokens yet"
|
||||||
:filter="tokensTable.filter"
|
:filter="tokensTable.filter"
|
||||||
>
|
>
|
||||||
{% raw %}
|
{% raw %}
|
||||||
<template v-slot:body="props">
|
<template v-slot:body="props">
|
||||||
<q-tr :props="props">
|
<q-tr :props="props">
|
||||||
<q-td
|
<q-td
|
||||||
key="value"
|
key="value"
|
||||||
:props="props"
|
:props="props"
|
||||||
:class="props.row.value > 0 ? 'text-green-13 text-weight-bold' : ''"
|
:class="props.row.value > 0 ? 'text-green-13 text-weight-bold' : ''"
|
||||||
>
|
>
|
||||||
<div>{{props.row.value}}</div>
|
<div>{{props.row.value}}</div>
|
||||||
</q-td>
|
</q-td>
|
||||||
<q-td key="count" :props="props">
|
<q-td key="count" :props="props">
|
||||||
<div>{{props.row.count}}</div>
|
<div>{{props.row.count}}</div>
|
||||||
</q-td>
|
</q-td>
|
||||||
<q-td key="sum" :props="props">
|
<q-td key="sum" :props="props">
|
||||||
<div>{{props.row.sum}}</div>
|
<div>{{props.row.sum}}</div>
|
||||||
</q-td>
|
</q-td>
|
||||||
<q-td key="memo" :props="props">
|
<q-td key="memo" :props="props">
|
||||||
<div>{{props.row.memo}}</div>
|
<div>{{props.row.memo}}</div>
|
||||||
</q-td>
|
</q-td>
|
||||||
</q-tr>
|
</q-tr>
|
||||||
</template>
|
</template>
|
||||||
{% endraw %}
|
{% endraw %}
|
||||||
</q-table>
|
</q-table>
|
||||||
</q-tab-panel>
|
</q-tab-panel>
|
||||||
|
|
||||||
<!-- ////////////////// INVOICE LIST ///////////////// -->
|
<!-- ////////////////// INVOICE LIST ///////////////// -->
|
||||||
|
|
||||||
<q-tab-panel name="invoices">
|
<q-tab-panel name="invoices">
|
||||||
<q-table
|
<q-table
|
||||||
dense
|
dense
|
||||||
flat
|
flat
|
||||||
:data="invoicesCashu"
|
:data="invoicesCashu"
|
||||||
:columns="invoicesTable.columns"
|
:columns="invoicesTable.columns"
|
||||||
:pagination.sync="invoicesTable.pagination"
|
:pagination.sync="invoicesTable.pagination"
|
||||||
no-data-label="There are no invoices here yet"
|
no-data-label="There are no invoices here yet"
|
||||||
:filter="invoicesTable.filter"
|
:filter="invoicesTable.filter"
|
||||||
>
|
>
|
||||||
{% raw %}
|
{% raw %}
|
||||||
<template v-slot:body="props">
|
<template v-slot:body="props">
|
||||||
<q-tr :props="props">
|
<q-tr :props="props">
|
||||||
<q-td key="status" :props="props">
|
<q-td key="status" :props="props">
|
||||||
<div v-if="props.row.status == 'pending'">
|
<div v-if="props.row.status == 'pending'">
|
||||||
<q-icon
|
<q-icon
|
||||||
@click="showInvoiceDialog(props.row)"
|
@click="showInvoiceDialog(props.row)"
|
||||||
name="settings_ethernet"
|
name="settings_ethernet"
|
||||||
color="grey"
|
color="grey"
|
||||||
>
|
>
|
||||||
<q-tooltip>Pending</q-tooltip>
|
<q-tooltip>Pending</q-tooltip>
|
||||||
</q-icon>
|
</q-icon>
|
||||||
<q-badge
|
<q-badge
|
||||||
size="lg"
|
size="lg"
|
||||||
color="secondary"
|
color="secondary"
|
||||||
class="q-mr-md cursor-pointer"
|
class="q-mr-md cursor-pointer"
|
||||||
@click="recheckInvoice(props.row.hash)"
|
@click="recheckInvoice(props.row.hash)"
|
||||||
>
|
>
|
||||||
Check
|
Check
|
||||||
</q-badge>
|
</q-badge>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="props.row.status === 'paid'">
|
<div v-if="props.row.status === 'paid'">
|
||||||
<q-icon
|
<q-icon
|
||||||
v-if="props.row.amount>0"
|
v-if="props.row.amount>0"
|
||||||
name="call_received"
|
name="call_received"
|
||||||
color="green"
|
color="green"
|
||||||
><q-tooltip>Received</q-tooltip></q-icon
|
><q-tooltip>Received</q-tooltip></q-icon
|
||||||
>
|
>
|
||||||
<q-icon
|
<q-icon
|
||||||
v-if="props.row.amount<0"
|
v-if="props.row.amount<0"
|
||||||
name="call_made"
|
name="call_made"
|
||||||
color="red"
|
color="red"
|
||||||
><q-tooltip>Paid</q-tooltip></q-icon
|
><q-tooltip>Paid</q-tooltip></q-icon
|
||||||
>
|
>
|
||||||
<!-- <q-icon name="props.row.amount < 0 ? 'call_made' : 'call_received'" color="green"></q-icon> -->
|
<!-- <q-icon name="props.row.amount < 0 ? 'call_made' : 'call_received'" color="green"></q-icon> -->
|
||||||
</div>
|
</div>
|
||||||
</q-td>
|
</q-td>
|
||||||
<q-td
|
<q-td
|
||||||
key="amount"
|
key="amount"
|
||||||
:props="props"
|
:props="props"
|
||||||
:class="props.row.amount > 0 ? 'text-green-13 text-weight-bold' : ''"
|
:class="props.row.amount > 0 ? 'text-green-13 text-weight-bold' : ''"
|
||||||
>
|
>
|
||||||
<div>{{props.row.amount}}</div>
|
<div>{{props.row.amount}}</div>
|
||||||
</q-td>
|
</q-td>
|
||||||
|
|
||||||
<!-- <q-td key="memo" :props="props">
|
<!-- <q-td key="memo" :props="props">
|
||||||
<div>{{props.row.memo}}</div>
|
<div>{{props.row.memo}}</div>
|
||||||
</q-td> -->
|
</q-td> -->
|
||||||
<q-td key="date" :props="props">
|
<q-td key="date" :props="props">
|
||||||
<div>{{props.row.date}}</div>
|
<div>{{props.row.date}}</div>
|
||||||
</q-td>
|
</q-td>
|
||||||
<q-td key="bolt11" :props="props">
|
<q-td key="bolt11" :props="props">
|
||||||
<div>{{props.row.bolt11}}</div>
|
<div>{{props.row.bolt11}}</div>
|
||||||
</q-td>
|
</q-td>
|
||||||
<q-td key="hash" :props="props">
|
<q-td key="hash" :props="props">
|
||||||
<div>{{props.row.hash}}</div>
|
<div>{{props.row.hash}}</div>
|
||||||
</q-td>
|
</q-td>
|
||||||
</q-tr>
|
</q-tr>
|
||||||
</template>
|
</template>
|
||||||
{% endraw %}
|
{% endraw %}
|
||||||
</q-table>
|
</q-table>
|
||||||
</q-tab-panel>
|
</q-tab-panel>
|
||||||
|
|
||||||
<!-- ////////////////// HISTORY LIST ///////////////// -->
|
<!-- ////////////////// HISTORY LIST ///////////////// -->
|
||||||
|
|
||||||
<q-tab-panel name="history">
|
<q-tab-panel name="history">
|
||||||
<q-table
|
<q-table
|
||||||
dense
|
dense
|
||||||
flat
|
flat
|
||||||
:data="historyTokens"
|
:data="historyTokens"
|
||||||
:columns="historyTable.columns"
|
:columns="historyTable.columns"
|
||||||
:pagination.sync="historyTable.pagination"
|
:pagination.sync="historyTable.pagination"
|
||||||
no-data-label="There are no tokens here yet"
|
no-data-label="There are no tokens here yet"
|
||||||
:filter="historyTable.filter"
|
:filter="historyTable.filter"
|
||||||
>
|
>
|
||||||
{% raw %}
|
{% raw %}
|
||||||
<template v-slot:body="props">
|
<template v-slot:body="props">
|
||||||
<q-tr :props="props">
|
<q-tr :props="props">
|
||||||
<q-td key="status" :props="props">
|
<q-td key="status" :props="props">
|
||||||
<div v-if="props.row.status == 'pending'">
|
<div v-if="props.row.status == 'pending'">
|
||||||
<q-icon
|
<q-icon
|
||||||
@click="showTokenDialog(props.row.token)"
|
@click="showTokenDialog(props.row.token)"
|
||||||
name="settings_ethernet"
|
name="settings_ethernet"
|
||||||
color="grey"
|
color="grey"
|
||||||
>
|
>
|
||||||
<q-tooltip>Pending</q-tooltip>
|
<q-tooltip>Pending</q-tooltip>
|
||||||
</q-icon>
|
</q-icon>
|
||||||
<q-badge
|
<q-badge
|
||||||
size="lg"
|
size="lg"
|
||||||
color="secondary"
|
color="secondary"
|
||||||
class="q-mr-md cursor-pointer"
|
class="q-mr-md cursor-pointer"
|
||||||
@click="checkTokenSpendable(props.row.token)"
|
@click="checkTokenSpendable(props.row.token)"
|
||||||
>
|
>
|
||||||
Check
|
Check
|
||||||
</q-badge>
|
</q-badge>
|
||||||
</div>
|
</div>
|
||||||
<div v-if="props.row.status === 'paid'">
|
<div v-if="props.row.status === 'paid'">
|
||||||
<q-icon
|
<q-icon
|
||||||
v-if="props.row.amount>0"
|
v-if="props.row.amount>0"
|
||||||
name="call_received"
|
name="call_received"
|
||||||
color="green"
|
color="green"
|
||||||
><q-tooltip>Received</q-tooltip></q-icon
|
><q-tooltip>Received</q-tooltip></q-icon
|
||||||
>
|
>
|
||||||
<q-icon
|
<q-icon
|
||||||
v-if="props.row.amount<0"
|
v-if="props.row.amount<0"
|
||||||
name="call_made"
|
name="call_made"
|
||||||
color="red"
|
color="red"
|
||||||
><q-tooltip>Paid</q-tooltip></q-icon
|
><q-tooltip>Paid</q-tooltip></q-icon
|
||||||
>
|
>
|
||||||
<!-- <q-icon name="props.row.amount < 0 ? 'call_made' : 'call_received'" color="green"></q-icon> -->
|
<!-- <q-icon name="props.row.amount < 0 ? 'call_made' : 'call_received'" color="green"></q-icon> -->
|
||||||
</div>
|
</div>
|
||||||
</q-td>
|
</q-td>
|
||||||
<q-td
|
<q-td
|
||||||
key="amount"
|
key="amount"
|
||||||
:props="props"
|
:props="props"
|
||||||
:class="props.row.amount > 0 ? 'text-green-13 text-weight-bold' : ''"
|
:class="props.row.amount > 0 ? 'text-green-13 text-weight-bold' : ''"
|
||||||
>
|
>
|
||||||
<div>{{props.row.amount}}</div>
|
<div>{{props.row.amount}}</div>
|
||||||
</q-td>
|
</q-td>
|
||||||
|
|
||||||
<q-td key="date" :props="props">
|
<q-td key="date" :props="props">
|
||||||
<div>{{props.row.date}}</div>
|
<div>{{props.row.date}}</div>
|
||||||
</q-td>
|
</q-td>
|
||||||
<q-td key="token" :props="props">
|
<q-td key="token" :props="props">
|
||||||
<div>{{props.row.token}}</div>
|
<div>{{props.row.token}}</div>
|
||||||
</q-td>
|
</q-td>
|
||||||
</q-tr>
|
</q-tr>
|
||||||
</template>
|
</template>
|
||||||
{% endraw %}
|
{% endraw %}
|
||||||
</q-table>
|
</q-table>
|
||||||
</q-tab-panel>
|
</q-tab-panel>
|
||||||
</q-tab-panels>
|
</q-tab-panels>
|
||||||
</q-card-section>
|
</q-card-section>
|
||||||
</q-card>
|
</q-card>
|
||||||
|
|
||||||
<div class="q-pa-sd q-py-md" align="center">
|
<div
|
||||||
<q-btn
|
class="q-pa-sd q-pt-md q-mb-xl"
|
||||||
class="q-mx-sm"
|
style="margin-bottom: 5rem"
|
||||||
size="10px"
|
align="center"
|
||||||
rectangle
|
>
|
||||||
color="warning"
|
<q-btn
|
||||||
outline
|
class="q-mx-sm"
|
||||||
@click="showDisclaimerDialog"
|
size="10px"
|
||||||
>
|
rectangle
|
||||||
Warning</q-btn
|
color="warning"
|
||||||
>
|
outline
|
||||||
<q-btn
|
@click="showDisclaimerDialog"
|
||||||
class="q-mx-sm"
|
>
|
||||||
size="10px"
|
Warning</q-btn
|
||||||
outline
|
>
|
||||||
rectangle
|
<q-btn
|
||||||
color="warning"
|
class="q-mx-sm"
|
||||||
@click="getLocalstorageToFile"
|
size="10px"
|
||||||
>Backup<q-tooltip>Download wallet backup</q-tooltip></q-btn
|
outline
|
||||||
>
|
rectangle
|
||||||
</div>
|
color="warning"
|
||||||
</q-scroll-area>
|
@click="getLocalstorageToFile"
|
||||||
|
>Backup<q-tooltip>Download wallet backup</q-tooltip></q-btn
|
||||||
|
>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<q-tabs
|
<q-tabs
|
||||||
|
|
Loading…
Reference in New Issue
Block a user