{% extends "base.html" %} {% from "macros.jinja" import window_vars with context
%} {% block page %}
<div class="row q-col-gutter-md justify-center">
  <div class="col q-gutter-y-md">
    <q-card>
      <div class="q-pa-md">
        <div class="q-gutter-y-md">
          <q-tabs v-model="tab" active-color="primary" align="justify">
            <q-tab
              name="funding"
              label="Funding"
              @update="val => tab = val.name"
            ></q-tab>
            <q-tab
              name="users"
              label="Users"
              @update="val => tab = val.name"
            ></q-tab>
            <q-tab
              name="server"
              label="Server"
              @update="val => tab = val.name"
            ></q-tab>
            <q-tab
              name="theme"
              label="Theme"
              @update="val => tab = val.name"
            ></q-tab>
          </q-tabs>
        </div>
      </div>

      <q-form @submit="UpdateLNbits">
        <q-tab-panels v-model="tab" animated>
          <q-tab-panel name="funding">
            <q-card-section class="q-pa-none">
              <h6 class="q-my-none">Wallets Management</h6>
              <br />
              <div>
                <div class="row">
                  <div class="col">
                    <p>Funding Source Info</p>
                    <ul>
                      {%raw%}
                      <li>Funding Source: {{data.admin.funding_source}}</li>
                      <li>Balance: {{data.admin.balance / 1000}} sats</li>
                      {%endraw%}
                    </ul>
                    <br />
                  </div>
                </div>
                <div class="row q-col-gutter-md">
                  <div class="col-12 col-md-6">
                    <div class="row">
                      <div class="col-12">
                        <p>
                          Active Funding<small>
                            (Requires server restart)</small
                          >
                        </p>
                        <q-select
                          filled
                          v-model="data.admin.funding_source"
                          hint="Select the active funding wallet"
                          :options="data.funding_source"
                        ></q-select>
                        <br />
                      </div>
                      <div class="col-12">
                        <p>Fee reserve</p>
                        <div class="row q-col-gutter-md">
                          <div class="col-6">
                            <q-input
                              dense
                              type="number"
                              filled
                              v-model="data.admin.reserve_fee_min"
                              label="Reserve fee in msats"
                            ></q-input>
                          </div>
                          <div class="col-6">
                            <q-input
                              dense
                              type="number"
                              filled
                              v-model="data.admin.reserve_fee_pct"
                              label="Reserve fee in percent"
                              step="0.1"
                            ></q-input>
                          </div>
                        </div>
                        <br />
                      </div>
                    </div>
                  </div>
                  <div class="col-12 col-md-6">
                    <!-- <q-form @submit="topupWallet"> -->
                    <p>TopUp a wallet</p>
                    <div class="row">
                      <div class="col-12">
                        <q-input
                          dense
                          type="text"
                          filled
                          v-model="wallet.data.id"
                          label="Wallet ID"
                          hint="Use the wallet ID to topup any wallet"
                        ></q-input>
                        <br />
                      </div>
                      <div class="col-12">
                        <q-input
                          dense
                          type="number"
                          filled
                          v-model="wallet.data.amount"
                          label="Topup amount"
                        ></q-input>
                      </div>
                    </div>
                    <div>
                      <q-btn
                        class="q-mt-md float-right"
                        label="Topup"
                        color="primary"
                        @click="topupWallet"
                      ></q-btn>
                    </div>
                    <!-- </q-form> -->
                    <br />
                  </div>
                </div>
                <p>Funding Sources</p>
                {% raw %}
                <q-list v-for="fund in data.admin.funding" :key="fund.id">
                  <q-expansion-item
                    expand-separator
                    icon="payments"
                    :label="fund.backend_wallet"
                  >
                    <q-card>
                      <q-card-section>
                        <q-input
                          v-if="fund.endpoint"
                          filled
                          type="text"
                          v-model="fund.endpoint"
                          label="Endpoint"
                          class="q-pr-md"
                        ></q-input>
                        <q-input
                          v-if="fund.port"
                          filled
                          type="text"
                          v-model="fund.port"
                          label="Port"
                          class="q-pr-md"
                        ></q-input>
                        <q-input
                          v-if="fund.admin_key"
                          filled
                          type="text"
                          v-model="fund.admin_key"
                          label="Admin Key"
                          class="q-pr-md"
                        ></q-input>
                        <q-input
                          v-if="fund.cert"
                          filled
                          type="text"
                          v-model="fund.cert"
                          label="Location of your ssl cert"
                          class="q-pr-md"
                        ></q-input>
                        <q-btn
                          class="q-mt-md"
                          label="Save"
                          flat
                          color="primary"
                          @click="updateFunding(fund.backend_wallet)"
                        ></q-btn>
                      </q-card-section>
                    </q-card>
                  </q-expansion-item>
                </q-list>
                {% endraw %}
                <!-- <q-list bordered class="rounded-borders">
                  <q-expansion-item
                    expand-separator
                    icon="payments"
                    :label="data.admin.funding.CLightningWallet.backend_wallet"
                    @click="data.admin.funding.CLightningWallet[7] = 1"
                  >
                    <q-card>
                      <q-card-section>
                        <q-input
                          filled
                          type="text"
                          v-model="data.admin.funding.CLightningWallet.endpoint"
                          label="GRPC Endpoint"
                          class="q-pr-md"
                          hint="ie /home/bob/.lightning/bitcoin/lightning-rpc"
                        ></q-input>
                        <q-btn
                          class="q-mt-md"
                          label="Save"
                          flat
                          color="primary"
                          @click="updateFunding(data.admin.funding.CLightningWallet.backend_wallet)"
                        ></q-btn>
                      </q-card-section>
                    </q-card>
                  </q-expansion-item>

                  <q-expansion-item
                    expand-separator
                    icon="payments"
                    :label="data.admin.funding.SparkWallet.backend_wallet"
                    @click="data.admin.funding.SparkWallet[7] = 1"
                  >
                    <q-card>
                      <q-card-section>
                        <div class="row">
                          <div class="col">
                            <q-input
                              filled
                              v-model="data.admin.funding.SparkWallet.endpoint"
                              label="LND REST Endpoint"
                              class="q-pr-md"
                              hint="ie http://localhost:9737/rpc"
                            ></q-input>
                          </div>
                          <div class="col"></div>
                        </div>
                        <div class="row">
                          <div class="col">
                            <q-input
                              filled
                              v-model="data.admin.funding.SparkWallet.admin_key"
                              label="Access token"
                              class="q-pr-md"
                              hint="Your access token"
                            ></q-input>
                          </div>
                          <div class="col"></div>
                        </div>
                      </q-card-section>
                    </q-card>
                  </q-expansion-item>

                  <q-expansion-item
                    expand-separator
                    icon="payments"
                    :label="data.admin.funding.LndRestWallet.backend_wallet"
                    @click="data.admin.funding.LndRestWallet[7] = 1"
                  >
                    <q-card>
                      <q-card-section>
                        <div class="row">
                          <div class="col">
                            <q-input
                              filled
                              v-model="data.admin.funding.LndRestWallet.endpoint"
                              label="LND REST Endpoint"
                              class="q-pr-md"
                              hint="default 127.0.0.1"
                            ></q-input>
                          </div>
                          <div class="col"></div>
                        </div>
                        <div class="row">
                          <div class="col">
                            <q-input
                              filled
                              v-model="data.admin.funding.LndRestWallet.cert"
                              label="LND self-signed cert"
                              class="q-pr-md"
                              hint="Location of your ssl cert"
                            ></q-input>
                          </div>
                          <div class="col">
                            <q-input
                              filled
                              v-model="data.admin.funding.LndRestWallet.admin_key"
                              label="LND admin macaroon"
                              class="q-pr-md"
                              hint="Your admin macaroon as hex or location"
                            ></q-input>
                          </div>
                        </div>
                      </q-card-section>
                    </q-card>
                  </q-expansion-item>

                  <q-expansion-item
                    expand-separator
                    icon="payments"
                    :label="data.admin.funding.LndWallet.backend_wallet"
                    @click="data.admin.funding.LndWallet[7] = 1"
                  >
                    <q-card>
                      <q-card-section>
                        <div class="row">
                          <div class="col">
                            <q-input
                              filled
                              v-model="data.admin.funding.LndWallet.endpoint"
                              label="LND GRPC Endpoint"
                              class="q-pr-md"
                              hint="default 127.0.0.1"
                            ></q-input>
                          </div>
                          <div class="col">
                            <q-input
                              filled
                              v-model="data.admin.funding.LndWallet.port"
                              label="LND GRPC port"
                              class="q-pr-md"
                              hint="Deafault 11009"
                            ></q-input>
                          </div>
                        </div>

                        <div class="row">
                          <div class="col">
                            <q-input
                              filled
                              v-model="data.admin.funding.LndWallet.cert"
                              label="LND self-signed cert"
                              class="q-pr-md"
                              hint="Location of your ssl cert"
                            ></q-input>
                          </div>
                          <div class="col">
                            <q-input
                              filled
                              v-model="data.admin.funding.LndWallet.admin_key"
                              label="LND admin macaroon"
                              class="q-pr-md"
                              hint="Your admin macaroon as hex or location"
                            ></q-input>
                          </div>
                        </div>
                      </q-card-section>
                    </q-card>
                  </q-expansion-item>

                  <q-expansion-item
                    expand-separator
                    icon="payments"
                    :label="data.admin.funding.LntxbotWallet.backend_wallet"
                    @click="data.admin.funding.LntxbotWallet[7] = 1"
                  >
                    <q-card>
                      <q-card-section>
                        <div class="row">
                          <div class="col">
                            <q-input
                              filled
                              v-model="data.admin.funding.LntxbotWallet.admin_key"
                              label="Admin key"
                              class="q-pr-md"
                              hint="use /api in LNTXBOT"
                            ></q-input>
                          </div>
                          <div class="col"></div>
                        </div>
                      </q-card-section>
                    </q-card>
                  </q-expansion-item>

                  <q-expansion-item
                    expand-separator
                    icon="payments"
                    :label="data.admin.funding.LNPayWallet.backend_wallet"
                    @click="data.admin.funding.LNPayWallet[7] = 1"
                  >
                    <q-card>
                      <q-card-section>
                        <div class="row">
                          <div class="col">
                            <q-input
                              filled
                              v-model="data.admin.funding.LNPayWallet.cert"
                              label="API key"
                              class="q-pr-md"
                            ></q-input>
                          </div>
                          <div class="col">
                            <q-input
                              filled
                              v-model="data.admin.funding.LNPayWallet.admin_key"
                              label="Admin key"
                              class="q-pr-md q-pb-md"
                            ></q-input>
                          </div>
                        </div>
                      </q-card-section>
                    </q-card>
                  </q-expansion-item>

                  <q-expansion-item
                    expand-separator
                    icon="payments"
                    :label="data.admin.funding.LnbitsWallet.backend_wallet"
                    @click="data.admin.funding.LnbitsWallet[7] = 1"
                  >
                    <q-card>
                      <q-card-section>
                        <div class="row">
                          <div class="col">
                            <q-input
                              filled
                              v-model="data.admin.funding.LnbitsWallet.endpoint"
                              label="LNbits endpoint"
                              class="q-pr-md"
                              hint="ie https://lnbits.com, default 127.0.0.1"
                            ></q-input>
                          </div>
                          <div class="col"></div>
                        </div>
                        <div class="row">
                          <div class="col">
                            <q-input
                              filled
                              v-model="data.admin.funding.LnbitsWallet.admin_key"
                              label="Admin key"
                              class="q-pr-md q-pb-md"
                            ></q-input>
                          </div>
                          <div class="col"></div>
                        </div>
                      </q-card-section>
                    </q-card>
                  </q-expansion-item>

                  <q-expansion-item
                    expand-separator
                    icon="payments"
                    :label="data.admin.funding.OpenNodeWallet.backend_wallet"
                    @click="data.admin.funding.OpenNodeWallet[7] = 1"
                  >
                    <q-card>
                      <q-card-section>
                        <div class="row">
                          <div class="col">
                            <q-input
                              filled
                              v-model="data.admin.funding.OpenNodeWallet.admin_key"
                              label="Admin key"
                              class="q-pr-md"
                            ></q-input>
                          </div>
                          <div class="col"></div>
                        </div>
                      </q-card-section>
                    </q-card>
                  </q-expansion-item>
                </q-list> -->
              </div>
            </q-card-section>
          </q-tab-panel>
          <q-tab-panel name="users">
            <q-card-section class="q-pa-none">
              <h6 class="q-my-none">User Management</h6>
              <br />
              <p class="q-my-none">
                Super Admin: {% raw %}{{this.data.admin.user}}{% endraw %}
              </p>
              <br />
              <div>
                <p>Admin Users</p>
                <q-input
                  filled
                  v-model="data.admin_users_add"
                  @keydown.enter="addAdminUser"
                  type="text"
                  label="User ID"
                  hint="Users with admin privileges"
                >
                  <q-btn @click="addAdminUser" dense flat icon="add"></q-btn>
                </q-input>
                <div>
                  {% raw %}
                  <q-chip
                    v-for="user in data.admin.admin_users.slice(1)"
                    :key="user"
                    removable
                    @remove="removeAdminUser(user)"
                    color="primary"
                    text-color="white"
                  >
                    {{ user }}
                  </q-chip>
                  {% endraw %}
                </div>
                <br />
              </div>
              <div>
                <p>Allowed Users</p>
                <q-input
                  filled
                  v-model="data.allowed_users_add"
                  @keydown.enter="addAllowedUser"
                  type="text"
                  label="User ID"
                  hint="Only these users can use LNbits"
                >
                  <q-btn @click="addAllowedUser" dense flat icon="add"></q-btn>
                </q-input>
                <div>
                  {% raw %}
                  <q-chip
                    v-for="user in data.admin.allowed_users"
                    :key="user"
                    removable
                    @remove="removeAllowedUser(user)"
                    color="primary"
                    text-color="white"
                  >
                    {{ user }}
                  </q-chip>
                  {% endraw %}
                </div>
                <br />
              </div>
              <div class="row q-col-gutter-md">
                <div class="col-12 col-md-6">
                  <p>Admin Extensions</p>
                  <q-select
                    filled
                    v-model="data.admin.admin_ext"
                    multiple
                    hint="Extensions only user with admin privileges can use"
                    :options="options"
                    label="Admin extensions"
                  ></q-select>
                  <br />
                </div>
                <div class="col-12 col-md-6">
                  <p>Disabled Extensions</p>
                  <q-select
                    filled
                    v-model="data.admin.disabled_ext"
                    multiple
                    hint="Disable extensions *amilk disabled by default as resource heavy"
                    :options="options"
                    label="Disable extensions"
                  ></q-select>
                  <br />
                </div>
              </div>
              <div class="row q-mt-lg">
                <q-btn unelevated color="primary" type="submit">Save</q-btn>
              </div>
            </q-card-section>
          </q-tab-panel>
          <q-tab-panel name="server">
            <q-card-section class="q-pa-none">
              <h6 class="q-my-none">Server Management</h6>
              <br />
              <div>
                <div class="row">
                  <div class="col">
                    <p>Server Info</p>
                    <ul>
                      {%raw%}
                      <li v-if="data.admin.data_folder">
                        SQlite: {{data.admin.data_folder}}
                      </li>
                      <li v-if="data.admin.database_url">
                        Postgres: {{data.admin.database_url}}
                      </li>
                      {%endraw%}
                    </ul>
                    <br />
                  </div>
                </div>
                <div class="row q-col-gutter-md">
                  <div class="col-12 col-md-6">
                    <p>Service Fee</p>
                    <q-input
                      filled
                      type="number"
                      v-model.number="data.admin.service_fee"
                      label="Service fee (%)"
                      step="0.1"
                      hint="Fee charged per tx (%)"
                    ></q-input>
                    <br />
                  </div>
                  <div class="col-12 col-md-6">
                    <p>Miscelaneous</p>
                    <q-item tag="label" v-ripple>
                      <q-item-section>
                        <q-item-label>Force HTTPS</q-item-label>
                        <q-item-label caption>Prefer secure URLs</q-item-label>
                      </q-item-section>
                      <q-item-section avatar>
                        <q-toggle
                          size="md"
                          v-model="data.admin.force_https"
                          checked-icon="check"
                          color="green"
                          unchecked-icon="clear"
                        />
                      </q-item-section>
                    </q-item>
                    <q-item tag="label" v-ripple>
                      <q-item-section>
                        <q-item-label>Hide API</q-item-label>
                        <q-item-label caption
                          >Hides wallet api, extensions can choose to
                          honor</q-item-label
                        >
                      </q-item-section>
                      <q-item-section avatar>
                        <q-toggle
                          size="md"
                          v-model="data.admin.hide_api"
                          checked-icon="check"
                          color="green"
                          unchecked-icon="clear"
                        />
                      </q-item-section>
                    </q-item>
                    <br />
                  </div>
                </div>
              </div>

              <div class="row q-mt-lg">
                <q-btn unelevated color="primary" type="submit">Save</q-btn>
              </div>
            </q-card-section>
          </q-tab-panel>
          <q-tab-panel name="theme">
            <q-card-section class="q-pa-none">
              <h6 class="q-my-none">UI Management</h6>
              <br />
              <div>
                <div class="row q-col-gutter-md">
                  <div class="col-12 col-md-6">
                    <p>Site Title</p>
                    <q-input
                      filled
                      type="text"
                      v-model="data.admin.site_title"
                      label="Site title"
                    ></q-input>
                    <br />
                  </div>
                  <div class="col-12 col-md-6">
                    <p>Site Tagline</p>
                    <q-input
                      filled
                      type="text"
                      v-model="data.admin.site_tagline"
                      label="Site tagline"
                    ></q-input>
                    <br />
                  </div>
                </div>
                <div>
                  <p>Site Description</p>
                  <q-input
                    v-model="data.admin.site_description"
                    filled
                    type="textarea"
                    hint="Use plain text or raw HTML"
                  />
                </div>
                <br />
                <div class="row q-col-gutter-md">
                  <div class="col-12 col-md-6">
                    <p>Default Wallet Name</p>
                    <q-input
                      filled
                      type="text"
                      v-model="data.admin.default_wallet_name"
                      label="LNbits wallet"
                    ></q-input>
                    <br />
                  </div>
                  <div class="col-12 col-md-6">
                    <p>Denomination</p>
                    <q-input
                      filled
                      type="text"
                      v-model="data.admin.denomination"
                      label="sats"
                      hint="The name for the FakeWallet token"
                    ></q-input>
                    <br />
                  </div>
                </div>
                <div class="row q-col-gutter-md">
                  <div class="col-12 col-md-6">
                    <p>Themes</p>
                    <q-select
                      filled
                      v-model="data.admin.theme"
                      multiple
                      hint="Choose themes available for users"
                      :options="themes"
                      label="Themes"
                    ></q-select>
                    <br />
                  </div>
                  <div class="col-12 col-md-6">
                    <p>Advertisement Slots</p>
                    <q-input
                      filled
                      v-model="data.ad_space_add"
                      @keydown.enter="addAdSpace"
                      type="text"
                      label="Ad image URL"
                      hint="Ad image filepaths or urls, extensions can choose to honor"
                    >
                      <q-btn @click="addAdSpace" dense flat icon="add"></q-btn>
                    </q-input>
                    <div>
                      {% raw %}
                      <q-chip
                        v-for="space in data.admin.ad_space"
                        :key="space"
                        removable
                        @remove="removeAdSpace(space)"
                        color="primary"
                        text-color="white"
                      >
                        {{ space.slice(0, 8) + " ... " + space.slice(-8) }}
                      </q-chip>
                      {% endraw %}
                    </div>
                    <br />
                  </div>
                </div>
                <div class="row q-col-gutter-md">
                  <div class="col-12 col-md-6">
                    <p>Custom Logo</p>
                    <q-input
                      filled
                      type="text"
                      v-model="data.admin.custom_logo"
                      label="https://example.com/image.png"
                      hint="URL to logo image"
                    ></q-input>
                    <br />
                  </div>
                </div>
              </div>

              <div class="row q-mt-lg">
                <q-btn unelevated color="primary" type="submit">Save</q-btn>
              </div>
            </q-card-section>
          </q-tab-panel>
        </q-tab-panels>
      </q-form>
    </q-card>
  </div>
</div>
<!-- END TABS -->

<div class="row">
  <!-- <div class="col-8">
    <q-card class="q-mr-md">
      <q-form @submit="UpdateLNbits" class="q-px-md q-py-md">
        <h6 class="q-my-md">Settings</h6>
        <div class="row">
          <div class="col">
            <q-input
              filled
              v-model="data.admin.site_title"
              label="Site title"
              class="q-pr-md"
              hint="To replace the default 'LNbits' name and tagline"
            ></q-input>
          </div>
          <div class="col">
            <q-input
              filled
              v-model="data.admin.tagline"
              label="Tagline"
            ></q-input>
          </div>
        </div>

        <div class="row">
          <div class="col">
            <q-input
              filled
              class="q-pr-md"
              type="text"
              v-model="data.admin.description"
              label="Description"
              hint="Short blurb about your lnbits"
            ></q-input>
          </div>
          <div class="col">
            <q-select
              filled
              v-model="data.admin.disabled_ext"
              multiple
              hint="Disable extensions *amilk disabled by default as resource heavy"
              :options="options"
              label="Disable extensions"
            ></q-select>
          </div>
        </div>
        <div class="row">
          <div class="col">
            <q-input
              filled
              class="q-pr-md"
              type="number"
              v-model="data.admin.service_fee"
              label="Sevice fee"
              hint="What percentage to charge per transaction *default 0"
            ></q-input>
          </div>
          <div class="col">
            <q-input
              filled
              v-model="data.admin.default_wallet_name"
              label="Default wallet name"
              hint="Default name for wallets generated without being named"
            ></q-input>
          </div>
        </div>
        <div class="row">
          <div class="col">
            <q-input
              filled
              class="q-pr-md"
              v-model="data.admin.data_folder"
              label="Data folder"
              hint="Where your databases will be saved"
            ></q-input>
          </div>
          <div class="col">
            <q-input
              filled
              class="q-pr-md"
              v-model="data.admin.admin_users"
              label="Admin user"
              hint=""
            ></q-input>
          </div>
        </div>
        <br />

        <q-list bordered class="rounded-borders">
          <q-expansion-item
            expand-separator
            icon="payments"
            :label="data.admin.funding.CLightningWallet.backend_wallet"
            @click="data.admin.funding.CLightningWallet[7] = 1"
          >
            <q-card>
              <q-card-section>
                <q-input
                  filled
                  v-model="data.admin.funding.CLightningWallet.endpoint"
                  label="GRPC Endpoint"
                  class="q-pr-md"
                  hint="ie /home/bob/.lightning/bitcoin/lightning-rpc"
                ></q-input>
              </q-card-section>
            </q-card>
          </q-expansion-item>

          <q-expansion-item
            expand-separator
            icon="payments"
            :label="data.admin.funding.SparkWallet.backend_wallet"
            @click="data.admin.funding.SparkWallet[7] = 1"
          >
            <q-card>
              <q-card-section>
                <div class="row">
                  <div class="col">
                    <q-input
                      filled
                      v-model="data.admin.funding.SparkWallet.endpoint"
                      label="LND REST Endpoint"
                      class="q-pr-md"
                      hint="ie http://localhost:9737/rpc"
                    ></q-input>
                  </div>
                  <div class="col"></div>
                </div>
                <div class="row">
                  <div class="col">
                    <q-input
                      filled
                      v-model="data.admin.funding.SparkWallet.admin_key"
                      label="Access token"
                      class="q-pr-md"
                      hint="Your access token"
                    ></q-input>
                  </div>
                  <div class="col"></div>
                </div>
              </q-card-section>
            </q-card>
          </q-expansion-item>

          <q-expansion-item
            expand-separator
            icon="payments"
            :label="data.admin.funding.LndRestWallet.backend_wallet"
            @click="data.admin.funding.LndRestWallet[7] = 1"
          >
            <q-card>
              <q-card-section>
                <div class="row">
                  <div class="col">
                    <q-input
                      filled
                      v-model="data.admin.funding.LndRestWallet.endpoint"
                      label="LND REST Endpoint"
                      class="q-pr-md"
                      hint="default 127.0.0.1"
                    ></q-input>
                  </div>
                  <div class="col"></div>
                </div>
                <div class="row">
                  <div class="col">
                    <q-input
                      filled
                      v-model="data.admin.funding.LndRestWallet.cert"
                      label="LND self-signed cert"
                      class="q-pr-md"
                      hint="Location of your ssl cert"
                    ></q-input>
                  </div>
                  <div class="col">
                    <q-input
                      filled
                      v-model="data.admin.funding.LndRestWallet.admin_key"
                      label="LND admin macaroon"
                      class="q-pr-md"
                      hint="Your admin macaroon as hex or location"
                    ></q-input>
                  </div>
                </div>
              </q-card-section>
            </q-card>
          </q-expansion-item>

          <q-expansion-item
            expand-separator
            icon="payments"
            :label="data.admin.funding.LndWallet.backend_wallet"
            @click="data.admin.funding.LndWallet[7] = 1"
          >
            <q-card>
              <q-card-section>
                <div class="row">
                  <div class="col">
                    <q-input
                      filled
                      v-model="data.admin.funding.LndWallet.endpoint"
                      label="LND GRPC Endpoint"
                      class="q-pr-md"
                      hint="default 127.0.0.1"
                    ></q-input>
                  </div>
                  <div class="col">
                    <q-input
                      filled
                      v-model="data.admin.funding.LndWallet.port"
                      label="LND GRPC port"
                      class="q-pr-md"
                      hint="Deafault 11009"
                    ></q-input>
                  </div>
                </div>

                <div class="row">
                  <div class="col">
                    <q-input
                      filled
                      v-model="data.admin.funding.LndWallet.cert"
                      label="LND self-signed cert"
                      class="q-pr-md"
                      hint="Location of your ssl cert"
                    ></q-input>
                  </div>
                  <div class="col">
                    <q-input
                      filled
                      v-model="data.admin.funding.LndWallet.admin_key"
                      label="LND admin macaroon"
                      class="q-pr-md"
                      hint="Your admin macaroon as hex or location"
                    ></q-input>
                  </div>
                </div>
              </q-card-section>
            </q-card>
          </q-expansion-item>

          <q-expansion-item
            expand-separator
            icon="payments"
            :label="data.admin.funding.LntxbotWallet.backend_wallet"
            @click="data.admin.funding.LntxbotWallet[7] = 1"
          >
            <q-card>
              <q-card-section>
                <div class="row">
                  <div class="col">
                    <q-input
                      filled
                      v-model="data.admin.funding.LntxbotWallet.admin_key"
                      label="Admin key"
                      class="q-pr-md"
                      hint="use /api in LNTXBOT"
                    ></q-input>
                  </div>
                  <div class="col"></div>
                </div>
              </q-card-section>
            </q-card>
          </q-expansion-item>

          <q-expansion-item
            expand-separator
            icon="payments"
            :label="data.admin.funding.LNPayWallet.backend_wallet"
            @click="data.admin.funding.LNPayWallet[7] = 1"
          >
            <q-card>
              <q-card-section>
                <div class="row">
                  <div class="col">
                    <q-input
                      filled
                      v-model="data.admin.funding.LNPayWallet.cert"
                      label="API key"
                      class="q-pr-md"
                    ></q-input>
                  </div>
                  <div class="col">
                    <q-input
                      filled
                      v-model="data.admin.funding.LNPayWallet.admin_key"
                      label="Admin key"
                      class="q-pr-md q-pb-md"
                    ></q-input>
                  </div>
                </div>
              </q-card-section>
            </q-card>
          </q-expansion-item>

          <q-expansion-item
            expand-separator
            icon="payments"
            :label="data.admin.funding.LnbitsWallet.backend_wallet"
            @click="data.admin.funding.LnbitsWallet[7] = 1"
          >
            <q-card>
              <q-card-section>
                <div class="row">
                  <div class="col">
                    <q-input
                      filled
                      v-model="data.admin.funding.LnbitsWallet.endpoint"
                      label="LNbits endpoint"
                      class="q-pr-md"
                      hint="ie https://lnbits.com, default 127.0.0.1"
                    ></q-input>
                  </div>
                  <div class="col"></div>
                </div>
                <div class="row">
                  <div class="col">
                    <q-input
                      filled
                      v-model="data.admin.funding.LnbitsWallet.admin_key"
                      label="Admin key"
                      class="q-pr-md q-pb-md"
                    ></q-input>
                  </div>
                  <div class="col"></div>
                </div>
              </q-card-section>
            </q-card>
          </q-expansion-item>

          <q-expansion-item
            expand-separator
            icon="payments"
            :label="data.admin.funding.OpenNodeWallet.backend_wallet"
            @click="data.admin.funding.OpenNodeWallet[7] = 1"
          >
            <q-card>
              <q-card-section>
                <div class="row">
                  <div class="col">
                    <q-input
                      filled
                      v-model="data.admin.funding.OpenNodeWallet.admin_key"
                      label="Admin key"
                      class="q-pr-md"
                    ></q-input>
                  </div>
                  <div class="col"></div>
                </div>
              </q-card-section>
            </q-card>
          </q-expansion-item> </q-list
        ><br />
        <q-select
          outlined
          v-model="data.admin.funding_source_primary"
          style="max-width: 300px"
          class="q-pr-md"
          label="Select main funding source"
          :options="data.funding_source"
          label="Outlined"
        ></q-select
        ><br />
        <div>
          <q-btn label="Update" type="submit" color="primary"></q-btn>
        </div>
      </q-form>
    </q-card>
  </div> -->
</div>

{% endblock %} {% block scripts %} {{ window_vars(user) }}
<script>
  const queryString = window.location.search
  const urlParams = new URLSearchParams(queryString)
  const usr = urlParams.get('usr')
  new Vue({
    el: '#vue',
    mixins: [windowMixin],
    data: function () {
      return {
        wallet: {data: {}},
        cancel: {},
        tab: 'funding',
        data: {
          funding_source: [
            'CLightningWallet',
            'LndRestWallet',
            'LndWallet',
            'LntxbotWallet',
            'LNPayWallet',
            'LnbitsWallet',
            'OpenNodeWallet'
          ],

          admin: {
            edited: [],
            funding: [],
            senddata: {}
          }
        },
        themes: [
          'classic',
          'bitcoin',
          'flamingo',
          'mint',
          'autumn',
          'monochrome',
          'salvador'
        ],
        options: [
          'bleskomat',
          'captcha',
          'events',
          'example',
          'livestream',
          'lndhub',
          'lnurlp',
          'offlineshop',
          'paywall',
          'splitpayments',
          'subdomains',
          'tpos',
          'usermanager',
          'watchonly',
          'withdraw',
          'copilot',
          'hivemind',
          'jukebox',
          'lnticket',
          'ngrok',
          'amilk'
        ]
      }
    },
    created: function () {
      var self = this
      if (usr != null) {
        self.cancel.on = true
      }
      funding = JSON.parse(String('{{ funding  | tojson|safe }}'))
      funding.map(f => {
        this.data.admin.funding.push(f)
      })
      /*var i
      for (i = 0; i < funding.length; i++) {
        self.data.admin.funding[funding[i].backend_wallet] = funding[i]
      }*/
      let settings = JSON.parse('{{ settings | tojson|safe }}')
      settings.balance = '{{ balance }}'
      this.data.admin = {...this.data.admin, ...settings}
      console.log(this.data.admin)
      console.log(settings)
    },
    methods: {
      addAdminUser() {
        let addUser = this.data.admin_users_add
        let admin_users = this.data.admin.admin_users
        if (addUser && addUser.length && !admin_users.includes(addUser)) {
          admin_users.push(addUser)
          this.data.admin.admin_users = admin_users
          this.data.admin_users_add = ''
        }
      },
      removeAdminUser(user) {
        let admin_users = this.data.admin.admin_users
        this.data.admin.admin_users = admin_users.filter(u => u !== user)
      },
      addAllowedUser() {
        let addUser = this.data.allowed_users_add
        let allowed_users = this.data.admin.allowed_users
        if (addUser && addUser.length && !allowed_users.includes(addUser)) {
          allowed_users.push(addUser)
          this.data.admin.allowed_users = allowed_users
          this.data.allowed_users_add = ''
        }
      },
      removeAllowedUser(user) {
        let allowed_users = this.data.admin.allowed_users
        this.data.admin.allowed_users = allowed_users.filter(u => u !== user)
      },
      addAdSpace() {
        let adSpace = this.data.ad_space_add
        let spaces = this.data.admin.ad_space
        if (adSpace.length && !spaces.includes(adSpace)) {
          spaces.push(adSpace)
          this.data.admin.ad_space = spaces
          this.data.ad_space_add = ''
        }
      },
      removeAdSpace(ad) {
        let spaces = this.data.admin.ad_space
        this.data.admin.ad_space = spaces.filter(s => s !== ad)
      },
      topupWallet() {
        LNbits.api
          .request(
            'GET',
            '/admin/api/v1/admin/' +
              this.wallet.data.id +
              '/' +
              this.wallet.data.amount,
            this.g.user.wallets[0].adminkey
          )
          .then(response => {
            this.$q.notify({
              type: 'positive',
              message:
                'Success! Added ' +
                this.wallet.data.amount +
                ' to ' +
                this.wallet.data.id,
              icon: null
            })
            this.wallet.data = {}
          })
          .catch(function (error) {
            LNbits.utils.notifyApiError(error)
          })
      },

      createWallet: function () {
        LNbits.href.createWallet(this.walletName)
      },
      addSource: function (source) {
        var self = this
        self.data.admin.edited.push(source)
        console.log(self.data.admin.edited)
      },
      updateFunding(fund) {
        let data = this.data.admin.funding.find(v => v.backend_wallet == fund)

        LNbits.api
          .request(
            'POST',
            '/admin/api/v1/admin/funding',
            this.g.user.wallets[0].adminkey,
            data
          )
          .then(response => {
            //let wallet = response.data.backend_wallet
            //this.data.admin.funding[wallet] = response.data
            //this.data.admin.funding[wallet].endpoint = response.data.endpoint
            //console.log(this.data.admin.funding)
            //console.log(this.data.admin)
            this.$q.notify({
              type: 'positive',
              message: `Success! ${response.data.backend_wallet} changed!`,
              icon: null
            })
          })
      },
      UpdateLNbits() {
        let {
          admin_users,
          allowed_users,
          admin_ext,
          disabled_ext,
          funding_source,
          force_https,
          reserve_fee_min,
          reserve_fee_pct,
          service_fee,
          hide_api,
          site_title,
          site_tagline,
          site_description,
          default_wallet_name,
          denomination,
          theme,
          custom_logo,
          ad_space
        } = this.data.admin
        let data = {
          admin_users: admin_users.toString(),
          allowed_users: allowed_users.toString(),
          admin_ext: admin_ext.toString(),
          disabled_ext: disabled_ext.toString(),
          funding_source,
          force_https,
          reserve_fee_min,
          reserve_fee_pct,
          service_fee,
          hide_api,
          site_title,
          site_tagline,
          site_description,
          default_wallet_name,
          denomination,
          theme: theme.toString(),
          custom_logo: custom_logo.toString(),
          ad_space: ad_space.toString()
        }
        //console.log(data)
        LNbits.api
          .request(
            'POST',
            '/admin/api/v1/admin/',
            this.g.user.wallets[0].adminkey,
            data
          )
          .then(response => {
            //console.log(response.data)
            this.$q.notify({
              type: 'positive',
              message: 'Success! Settings changed!',
              icon: null
            })
          })
          .catch(function (error) {
            LNbits.utils.notifyApiError(error)
          })
      },

      processing: function () {
        this.$q.notify({
          timeout: 0,
          message: 'Processing...',
          icon: null
        })
      }
    }
  })
</script>
{% endblock %}