Send Coins

src/components/CSendCoins/CSendCoins.vue

@@ -13,6 +13,15 @@
           <q-select rounded outlined v-model="circuitsel" :options="bothcircuits" label="Circuito">
           </q-select>
 
+          <CCurrencyValue
+            :symbol="circuitloaded.symbol"
+            :tips="t('account.saldo_tips')"
+            :color="circuitloaded.color"
+            :value="accountloaded ? accountloaded.saldo : 0"
+            :label="t('account.saldo')">
+
+          </CCurrencyValue>
+
           <q-input v-model="from_username" label="Mittente" class="full-width" disable>
           </q-input>
           <q-input v-model="to_user.username" label="Destinatario" class="full-width" disable>
@@ -21,21 +30,39 @@
           </q-input>
 
 
-          <q-input outlined v-model="qty" type="number"
-
-                   label="Quantità"
-                   :prefix="circuitloaded.symbol">
+          <q-input
+            ref="qtyRef"
+            class="q-px-sm text-h5"
+            outlined v-model="qty" type="number"
+                   :rules="[ val => val < tools.getRemainingCoinsToSend(accountloaded) || t('circuit.qta_remaining_to_send', { maxqta: tools.getRemainingCoinsToSend(accountloaded), symbol: circuitloaded.symbol })]"                   :label="t('movement.amount')"
+                   >
+                    <!--val => val > tools.getMaxCoinsToSend(accountloaded) || t('circuit.qta_max_to_send', { maxqta: tools.getRemainingCoinsToSend(accountloaded), symbol: circuitloaded.symbol })]" -->
             <template v-slot:append>
-              <q-avatar>
-                <img src="https://cdn.quasar.dev/logo-v2/svg/logo.svg">
-              </q-avatar>
+              <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>
 
+          <q-slider
+            v-model="qty"
+            color="green"
+            markers
+            :step="5"
+            :marker-labels="arrayMarkerLabel"
+            label-always
+            :label-value="priceLabel"
+            switch-label-side
+            switch-marker-labels-side
+            :inner-max="remainingCoins"
+            :min="0"
+            :max="accountloaded.fidoConcesso"
+          />
 
         </q-card-section>
         <q-card-actions align="center">
           <q-btn
+            :disable="qtyRef ? qtyRef.hasError : false"
             :label="$t('circuit.sendcoinsto', {qty, coin: circuitsel, dest: to_user.username })" color="primary"
             @click="sendCoin()"></q-btn>
           <q-btn flat :label="$t('dialog.cancel')" color="primary" v-close-popup></q-btn>