Files
myprojplanet_vite/src/components/CSendCoins/CSendCoins.vue
Surya Paolo e29de7e0f6 - Fare LISTA MOVIMENTI più comprensibile
- Grafica Circuiti
2024-10-02 03:46:40 +02:00

334 lines
11 KiB
Vue
Executable File

<template>
<q-dialog
v-model="showpage"
ref="sendCoinDialog"
:maximized="$q.screen.lt.sm"
@hide="hide"
@show="qtyRef ? qtyRef.focus() : ''"
>
<q-card
class="dialog_card"
style="display: flex; flex-direction: column; height: 100%"
>
<q-bar class="bg-primary text-white">
{{ $t('circuit.sendcoins') }}
<q-space />
<q-btn flat round color="white" icon="close" v-close-popup></q-btn>
</q-bar>
<q-card-section>
<q-stepper
v-model="step"
ref="stepper"
color="primary"
animated
class="mystepper"
>
<q-step
:name="0"
:title="getTitle(0)"
:icon="getIcon(0)"
:done="ifNextCheck(0)"
>
<CCheckCircuitsEnabled :to_user="to_user" :to_group="to_group">
</CCheckCircuitsEnabled>
<q-select
v-if="!circuitname"
:behavior="$q.platform.is.ios === true ? 'dialog' : 'menu'"
rounded
dense
outlined
v-model="circuitsel"
:options="bothcircuits"
label="Circuito"
>
</q-select>
<div v-else>{{ circuitname }}</div>
<q-banner
v-if="showProvinceToSelect"
rounded
class="bg-red text-white"
style="text-align: center"
>
<em style="font-weight: bold">{{
$t('circuit.insertprovince_text')
}}</em
><br />
</q-banner>
<q-banner
rounded
dense
class="shadow-5 q-my-sm"
color="primary q-title"
style="text-align: center"
>
<div class="mybanner_left q-mb-sm">
<q-select
v-if="arrTypesAccounts.length > 0"
v-model="tipoConto"
class="my-custom-select"
outlined
bg-color="light-blue-2"
emit-value
map-options
:options="arrTypesAccounts"
:label="$t('circuit.sender')"
></q-select>
</div>
<div
v-if="
tipoConto === shared_consts.AccountType.COLLECTIVE_ACCOUNT
"
>
<q-select
v-model="from_groupname"
:options="arrGroupsList"
:label="$t('circuit.choosecontocom')"
rounded
emit-value
map-options
>
<!-- Mostra i gruppi su cui sei Admin -->
</q-select>
</div>
<div
v-else-if="
tipoConto === shared_consts.AccountType.COMMUNITY_ACCOUNT
"
>
<q-input
v-model="from_contocom"
:label="$t('circuit.contocom')"
readonly
class="q-my-sm"
>
</q-input>
</div>
<CSaldo
v-if="circuitloaded && circuitloaded.symbol"
:symbol="circuitloaded.symbol"
:color="circuitloaded.color"
:saldo="accountloaded ? accountloaded.saldo : 0"
:qtarem="
accountloaded
? circuitStore.getRemainingCoinsToSend(accountloaded)
: 0
"
>
</CSaldo>
</q-banner>
<q-banner
rounded
dense
class="shadow-5 q-my-sm"
color="primary q-title"
>
<div class="mybanner_left bg-green text-white q-mb-sm">
{{ $t('circuit.dest') }}
</div>
<!-- Destination -->
<CMyUserOnlyView
v-if="to_user"
:mycontact="to_user"
:visu="costanti.FIND_PEOPLE"
@setCmd="tools.setCmd"
>
</CMyUserOnlyView>
<CMyGroupOnlyView
v-if="to_group"
:mygrp="to_group"
:visu="costanti.USER_GROUPS"
:circuitname="circuitloaded.name"
>
</CMyGroupOnlyView>
<CMyGroupOnlyView
v-if="circuitloaded && !!circuitloaded._id && to_contocom"
:mygrp="{ groupname: to_contocom }"
:visu="costanti.USER_GROUPS"
:circuitname="circuitloaded.name"
>
</CMyGroupOnlyView>
</q-banner>
<q-inner-loading id="spinner" :showing="loading">
<q-spinner-tail size="6em" color="primary" />
</q-inner-loading>
</q-step>
<q-step
:name="1"
:title="getTitle(1)"
:icon="getIcon(1)"
:done="ifNextCheck(1)"
>
<div v-if="circuitloaded && !!circuitloaded._id">
<q-banner
v-if="!circuitloaded.transactionsEnabled"
rounded
class="bg-red text-white"
style="text-align: center"
>
<em style="font-weight: bold">{{
$t('circuit.transactionsEnabled_text')
}}</em
><br />
</q-banner>
<q-input
ref="qtyRef"
class="q-py-sm text-h5"
outlined
v-model="qty"
:type="$q.platform.is.mobile ? 'string' : 'number'"
:rules="[
(val) =>
val <=
circuitStore.getRemainingCoinsToSend(accountloaded) ||
t('circuit.qta_remaining_to_send', {
maxqta:
circuitStore.getRemainingCoinsToSend(accountloaded),
symbol: circuitloaded.symbol,
}),
(val) => val > 0 || t('circuit.qta_not_valid'),
]"
:label="
t('movement.amount_to_send', {
qtamax: circuitStore.getRemainingCoinsToSend(accountloaded)
? circuitStore
.getRemainingCoinsToSend(accountloaded)
.toFixed(2)
: 0 + ` ` + circuitloaded.symbol,
})
"
input-class="text-right"
input-style="padding-bottom: 24px !important;"
v-on:keyup.enter="$event.target.nextElementSibling.focus()"
>
<!--val => val > circuitStore.getMaxCoinsToSend(accountloaded) || t('circuit.qta_max_to_send', { maxqta: tools.getRemainingCoinsToSend(accountloaded), symbol: circuitloaded.symbol })]" -->
<template v-slot:append>
<div class="text-h5">
<em
class="q-px-sm text-white rounded-borders"
:style="
`background-color: ` +
(circuitloaded.color ? circuitloaded.color : '#ff5500')
"
>{{ circuitloaded.symbol }}</em
>
</div>
</template>
</q-input>
<div class="q-mt-md">
<CNumericKeyboard v-model="qty" :showInput="false" />
</div>
</div>
</q-step>
<q-step
:name="2"
:title="getTitle(2)"
:icon="getIcon(2)"
:done="ifNextCheck(2)"
>
<!-- Destination -->
<CMyUserOnlyView
v-if="to_user"
:mycontact="to_user"
:visu="costanti.FIND_PEOPLE"
@setCmd="tools.setCmd"
>
</CMyUserOnlyView>
<CMyGroupOnlyView
v-if="to_group"
:mygrp="to_group"
:visu="costanti.USER_GROUPS"
:circuitname="circuitloaded.name"
>
</CMyGroupOnlyView>
<CMyGroupOnlyView
v-if="circuitloaded && !!circuitloaded._id && to_contocom"
:mygrp="{ groupname: to_contocom }"
:visu="costanti.USER_GROUPS"
:circuitname="circuitloaded.name"
>
</CMyGroupOnlyView>
<q-field class="text-center text-bold">
{{ $t('circuit.descr_casuale') }}
</q-field>
<q-input
ref="causalRef"
v-model="causal"
type="textarea"
filled
maxlength="500"
counter
:label="$t('circuit.note')"
class="q-my-sm full-width"
>
</q-input>
<div class="sendris">
{{
$t('circuit.sendcoinsto', {
qty,
coin: circuitloaded.symbol,
dest: to_group
? to_group.groupname
: to_user
? tools.getNomeUtenteByRecUser(to_user)
: to_contocom,
})
}}
sul {{ circuitsel }}
</div>
</q-step>
</q-stepper>
</q-card-section>
<q-card-actions align="center" style="row justify-between">
<q-btn
class="col"
flat
:label="$t('dialog.indietro')"
color="primary"
icon="navigate_before"
@click="clickIndietro(step)"
></q-btn>
<q-btn
class="col"
:disable="!ifNextCheck(step)"
:label="
step === 0 || step === 1
? $t('dialog.avanti')
: $t('circuit.sendcoins', {
qty,
coin: circuitloaded.symbol,
dest: to_group
? to_group.groupname
: to_user
? tools.getNomeUtenteByRecUser(to_user)
: to_contocom,
})
"
color="positive"
:icon-right="
step === 2 ? 'img: images/1ris_rosso_100.png' : 'navigate_next'
"
@click="clickAvanti(step)"
></q-btn>
</q-card-actions>
</q-card>
</q-dialog>
</template>
<script lang="ts" src="./CSendCoins.ts">
</script>
<style lang="scss" scoped>
@import './CSendCoins.scss';
</style>