{% extends "base.html" %} {% from "macros.jinja" import window_vars with context
%} {% block page %}
<div class="row q-col-gutter-md">
  <div class="col-12 col-md-8 q-gutter-y-md">
    <q-card class="q-pa-sm col-5">
      <q-card-section class="q-pa-none text-center">
        <q-form class="q-gutter-md">
          <q-select
            filled
            dense
            :options="g.user.wallets"
            :value="selectedWallet"
            label="Source Wallet:"
            option-label="name"
            @input="changedWallet"
          >
          </q-select>
        </q-form>
      </q-card-section>
    </q-card>

    <q-card class="q-pa-sm col-5">
      <q-card-section class="q-pa-none text-center">
        <div class="col">
          <h5 class="text-subtitle1 q-my-none">Target Wallets</h5>
        </div>

        <q-form class="q-gutter-md" @submit="saveTargets">
          <div
            class="q-gutter-md row items-start"
            style="flex-wrap: nowrap"
            v-for="(target, t) in targets"
          >
            <q-input
              dense
              outlined
              v-model="target.alias"
              label="Alias"
              :hint="t === targets.length - 1 ? 'A name to identify this target wallet locally.' : undefined"
              style="width: 150px"
            ></q-input>

            <q-input
              dense
              v-model="target.wallet"
              label="Target"
              hint="A wallet ID, invoice key, LNURLp or Lightning Address."
              option-label="name"
              style="width: 500px"
              new-value-mode="add-unique"
              use-input
              input-debounce="0"
              emit-value
            ></q-input>

            <q-input
              style="width: 150px"
              dense
              outlined
              v-model.number="target.percent"
              label="split"
              suffix="%"
            ></q-input>

            <q-btn
              @click="clearTarget(t)"
              round
              color="red"
              size="9px"
              icon="close"
            ></q-btn>
          </div>
          <div class="row justify-evenly q-pa-lg">
            <div>
              <q-btn icon="add" unelevated color="green" @click="addTarget()">
                Add Target
              </q-btn>
            </div>
            <div>
              <q-btn unelevated @click="deleteTargets()" color="red">
                Delete all Targets
              </q-btn>
            </div>

            <div>
              <q-btn
                unelevated
                color="primary"
                type="submit"
                :disabled="targets.length < 1"
              >
                Save Targets
              </q-btn>
            </div>
          </div>
        </q-form>
      </q-card-section>
    </q-card>
  </div>

  <div class="col-12 col-md-4 q-gutter-y-md">
    <q-card>
      <q-card-section>
        <h6 class="text-subtitle1 q-my-none">
          {{SITE_TITLE}} SplitPayments extension
        </h6>
      </q-card-section>
      <q-separator></q-separator>
      <q-card>
        <q-card-section>
          <p>
            Add some targets to the list of "Target Wallets", each with an
            associated <em>percentage</em>. After saving, every time any payment
            arrives at the "Source Wallet" that payment will be split with the
            target wallets according to their percentage.
          </p>
          <p>
            This is valid for every payment, doesn't matter how it was created.
          </p>
          <p>
            Targets can be LNBits wallets from this LNBits instance or any valid
            LNURL or LN Address.
          </p>
          <p class="text-warning">
            LNURLp and LN Addresses must allow comments > 100 chars and also
            have a flexible amount.
          </p>
          <p>
            To remove a wallet from the targets list just press the X and save.
            To remove all, click "Delete all Targets".
          </p>
          <p class="text-warning">
            For each split via LNURLp or Lightning addresses a fee_reserve is
            substracted, because of potential routing fees.
          </p>
        </q-card-section>
      </q-card>
    </q-card>
  </div>
</div>
{% endblock %} {% block scripts %} {{ window_vars(user) }}
<script src="/splitpayments/static/js/index.js"></script>
{% endblock %}