287 lines
8.2 KiB
HTML
287 lines
8.2 KiB
HTML
<div>
|
|
<q-tabs v-model="tab" no-caps class="bg-dark text-white shadow-2">
|
|
<q-tab name="info" label="Relay Info"></q-tab>
|
|
<q-tab name="payment" label="Payment"></q-tab>
|
|
<q-tab name="config" label="Config"></q-tab>
|
|
<q-tab name="allowed" label="Allowed"></q-tab>
|
|
<q-tab name="blocked" label="Blocked"></q-tab>
|
|
</q-tabs>
|
|
<q-tab-panels v-model="tab">
|
|
<q-tab-panel name="info">
|
|
<div v-if="relay">
|
|
<div class="row items-center no-wrap q-mb-md">
|
|
<div class="col-3 q-pr-lg">Name:</div>
|
|
<div class="col-6 q-pr-lg">
|
|
<q-input
|
|
filled
|
|
dense
|
|
v-model.trim="relay.name"
|
|
type="text"
|
|
></q-input>
|
|
</div>
|
|
<div class="col-3"></div>
|
|
</div>
|
|
<div class="row items-center no-wrap q-mb-md">
|
|
<div class="col-3 q-pr-lg">Description:</div>
|
|
<div class="col-6 q-pr-lg">
|
|
<q-input
|
|
filled
|
|
dense
|
|
v-model.trim="relay.description"
|
|
type="text"
|
|
></q-input>
|
|
</div>
|
|
<div class="col-3"></div>
|
|
</div>
|
|
<div class="row items-center no-wrap q-mb-md">
|
|
<div class="col-3 q-pr-lg">Relay Public Key:</div>
|
|
<div class="col-6 q-pr-lg">
|
|
<q-input
|
|
filled
|
|
dense
|
|
v-model.trim="relay.pubkey"
|
|
type="text"
|
|
></q-input>
|
|
</div>
|
|
<div class="col-3"></div>
|
|
</div>
|
|
<div class="row items-center no-wrap q-mb-md">
|
|
<div class="col-3 q-pr-lg">Contact:</div>
|
|
<div class="col-6 q-pr-lg">
|
|
<q-input
|
|
filled
|
|
dense
|
|
v-model.trim="relay.contact"
|
|
type="text"
|
|
></q-input>
|
|
</div>
|
|
<div class="col-3"></div>
|
|
</div>
|
|
</div>
|
|
</q-tab-panel>
|
|
<q-tab-panel name="payment">
|
|
<div v-if="relay">
|
|
<div class="row items-center no-wrap q-mb-md">
|
|
<div class="col-3 q-pr-lg">Require Payment:</div>
|
|
<div class="col-3 q-pr-lg">
|
|
<q-toggle
|
|
color="secodary"
|
|
v-model="relay.config.isPaidRelay"
|
|
@input="togglePaidRelay"
|
|
></q-toggle>
|
|
</div>
|
|
<div class="col-6">
|
|
<q-select
|
|
v-if="relay.config.isPaidRelay"
|
|
filled
|
|
dense
|
|
emit-value
|
|
v-model="relay.config.wallet"
|
|
:options="walletOptions"
|
|
label="Wallet *"
|
|
>
|
|
</q-select>
|
|
</div>
|
|
</div>
|
|
<div
|
|
v-if="relay.config.isPaidRelay"
|
|
class="row items-center no-wrap q-mb-md"
|
|
>
|
|
<div class="col-3 q-pr-lg">Cost to join (sats):</div>
|
|
<div class="col-3 q-pr-lg">
|
|
<q-input
|
|
filled
|
|
dense
|
|
v-model.trim="relay.config.costToJoin"
|
|
type="number"
|
|
min="0"
|
|
></q-input>
|
|
</div>
|
|
<div class="col-6">
|
|
<q-badge
|
|
v-if="relay.config.costToJoin == 0"
|
|
color="green"
|
|
class="float-left"
|
|
><span>Free to join</span>
|
|
</q-badge>
|
|
</div>
|
|
</div>
|
|
<div
|
|
v-if="relay.config.isPaidRelay"
|
|
class="row items-center no-wrap q-mb-md"
|
|
>
|
|
<div class="col-3 q-pr-lg">Storage cost per Kilo-Byte (sats):</div>
|
|
<div class="col-3 q-pr-lg">
|
|
<q-input
|
|
filled
|
|
dense
|
|
v-model.trim="relay.config.storageCostPerKb"
|
|
type="number"
|
|
min="0"
|
|
></q-input>
|
|
</div>
|
|
<div class="col-6">
|
|
<q-badge
|
|
v-if="relay.config.storageCostPerKb == 0"
|
|
color="green"
|
|
class="float-left"
|
|
><span>Unlimited storage</span>
|
|
</q-badge>
|
|
</div>
|
|
</div>
|
|
<div
|
|
v-if="relay.config.isPaidRelay && relay.config.storageCostPerKb != 0"
|
|
class="row items-center no-wrap q-mb-md"
|
|
>
|
|
<div class="col-3 q-pr-lg">Free storage (kb):</div>
|
|
<div class="col-3 q-pr-lg">
|
|
<q-input
|
|
filled
|
|
dense
|
|
v-model.trim="relay.config.freeStorage"
|
|
type="number"
|
|
min="0"
|
|
></q-input>
|
|
</div>
|
|
<div class="col-6">
|
|
<q-badge
|
|
v-if="relay.config.freeStorage == 0"
|
|
color="orange"
|
|
class="float-left"
|
|
><span>No free storage</span>
|
|
</q-badge>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</q-tab-panel>
|
|
<q-tab-panel name="config">
|
|
<div v-if="relay">
|
|
<div class="row items-center no-wrap q-mb-md">
|
|
<div class="col-3 q-pr-lg">Max Filters (per client):</div>
|
|
<div class="col-3 q-pr-lg">
|
|
<q-input
|
|
filled
|
|
dense
|
|
v-model.trim="relay.config.maxClientFilters"
|
|
type="number"
|
|
min="0"
|
|
></q-input>
|
|
</div>
|
|
<div class="col-6">
|
|
<q-badge
|
|
v-if="relay.config.maxClientFilters == 0"
|
|
color="green"
|
|
class="float-left"
|
|
><span>Unlimited Filters</span>
|
|
</q-badge>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</q-tab-panel>
|
|
<q-tab-panel name="allowed">
|
|
<div v-if="relay">
|
|
<div class="row items-center no-wrap q-mb-md">
|
|
<div class="col-3 q-pr-lg">Allowed Public Key</div>
|
|
<div class="col-7 q-pr-lg">
|
|
<q-input
|
|
filled
|
|
dense
|
|
v-model.trim="allowedPubkey"
|
|
type="text"
|
|
></q-input>
|
|
</div>
|
|
<div class="col-2 q-pr-lg">
|
|
<q-btn
|
|
unelevated
|
|
color="secondary"
|
|
class="float-right"
|
|
@click="allowPublicKey()"
|
|
>Add</q-btn
|
|
>
|
|
</div>
|
|
</div>
|
|
<div
|
|
:key="p"
|
|
v-for="p in relay.config.allowedPublicKeys"
|
|
class="row q-mb-xs"
|
|
>
|
|
<div class="col-3 q-pr-lg"></div>
|
|
<div class="col-9 q-pr-lg">
|
|
{{p}}
|
|
<q-btn
|
|
size="sm"
|
|
unelevated
|
|
color="pink"
|
|
icon="cancel"
|
|
class="float-right"
|
|
@click="deleteAllowedPublicKey(p)"
|
|
></q-btn>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</q-tab-panel>
|
|
<q-tab-panel name="blocked">
|
|
<div v-if="relay">
|
|
<div class="row items-center no-wrap q-mb-md">
|
|
<div class="col-3 q-pr-lg">Blocked Public Key</div>
|
|
<div class="col-7 q-pr-lg">
|
|
<q-input
|
|
filled
|
|
dense
|
|
v-model.trim="blockedPubkey"
|
|
type="text"
|
|
></q-input>
|
|
</div>
|
|
<div class="col-2 q-pr-lg">
|
|
<q-btn
|
|
unelevated
|
|
color="secondary"
|
|
class="float-right"
|
|
@click="blockPublicKey()"
|
|
>Add</q-btn
|
|
>
|
|
</div>
|
|
</div>
|
|
<div
|
|
:key="p"
|
|
v-for="p in relay.config.blockedPublicKeys"
|
|
class="row q-mb-xs"
|
|
>
|
|
<div class="col-3 q-pr-lg"></div>
|
|
<div class="col-9 q-pr-lg">
|
|
{{p}}
|
|
<q-btn
|
|
unelevated
|
|
size="sm"
|
|
color="pink"
|
|
icon="cancel"
|
|
class="float-right"
|
|
@click="deleteBlockedPublicKey(p)"
|
|
></q-btn>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</q-tab-panel>
|
|
</q-tab-panels>
|
|
<div class="row items-center q-mt-md q-mb-lg">
|
|
<div class="col-6 q-pr-lg">
|
|
<q-btn
|
|
unelevated
|
|
color="secondary"
|
|
class="float-left"
|
|
@click="updateRelay()"
|
|
>Update Relay</q-btn
|
|
>
|
|
</div>
|
|
<div class="col-6">
|
|
<q-btn
|
|
unelevated
|
|
color="pink"
|
|
icon="cancel"
|
|
class="float-right"
|
|
@click="deleteRelay()"
|
|
>Delete Relay</q-btn
|
|
>
|
|
</div>
|
|
</div>
|
|
</div>
|