Circuits OK

Accounts Ok
Movements OK

src/views/user/mycircuit/mycircuit.ts

@@ -6,6 +6,7 @@ import { CProfile } from '@/components/CProfile'
 import { CCheckIfIsLogged } from '@/components/CCheckIfIsLogged'
 import { CMyFieldRec } from '@/components/CMyFieldRec'
 import { CCurrencyValue } from '@/components/CCurrencyValue'
+import { CSaldo } from '@/components/CSaldo'
 import { CSkill } from '@/components/CSkill'
 import { CDateTime } from '@/components/CDateTime'
 import { tools } from '@store/Modules/tools'
@@ -16,21 +17,24 @@ import { useGlobalStore } from '@store/globalStore'
 import { useI18n } from '@/boot/i18n'
 import { toolsext } from '@store/Modules/toolsext'
 import { useQuasar } from 'quasar'
+import { CNotifAtTop } from '@src/components/CNotifAtTop'
 import { costanti } from '@costanti'
 import { ICity, IFriends, ICircuit, ISearchList, IUserFields, IAccount } from 'model'
 import { shared_consts } from '@/common/shared_vuejs'
 import { colmyUserPeople, colmyUserCircuit, colmyMovement } from '@store/Modules/fieldsTable'
 import { useNotifStore } from '@store/NotifStore'
+import { useCircuitStore } from '@store/CircuitStore'
 
 
 export default defineComponent({
   name: 'mycircuit',
   components: { CProfile, CTitleBanner, CMyFieldRec, CSkill, CDateTime, CMyFriends,
-    CGridTableRec, CMyUser, CCheckIfIsLogged, CCurrencyValue },
+    CGridTableRec, CMyUser, CCheckIfIsLogged, CCurrencyValue, CSaldo, CNotifAtTop },
   props: {},
   setup() {
     const userStore = useUserStore()
     const notifStore = useNotifStore()
+    const circuitStore = useCircuitStore()
     const $route = useRoute()
     const $q = useQuasar()
     const { t } = useI18n()
@@ -44,10 +48,13 @@ export default defineComponent({
     const showPic = ref(false)
 
     const circuit = ref(<ICircuit|null>{})
-    const account = ref(<IAccount|null>{})
+    const account = computed(() => circuit.value ? userStore.getAccountByCircuitId(circuit.value._id) : null )
     const mystatus = ref(<number>0)
     const users_in_circuit = ref(<IFriends[]>[])
 
+    const qtarem = computed(() => account.value ? circuitStore.getRemainingCoinsToSend(account.value) : 0)
+    const saldo = computed(() => account.value ? account.value.saldo : 0)
+
     const loading = ref(false)
     const requestToEnterCircuit = ref(false)
 
@@ -85,11 +92,6 @@ export default defineComponent({
             users_in_circuit.value = []
           }
 
-          if (circuit.value) {
-            account.value = userStore.getAccountByCircuitId(circuit.value._id)
-            console.log('account', account.value)
-          }
-
           mystatus.value = status
 
           loading.value = false
@@ -225,6 +227,9 @@ export default defineComponent({
       cities,
       path,
       requestToEnterCircuit,
+      circuitStore,
+      qtarem,
+      saldo,
     }
   }
 })

src/views/user/mycircuit/mycircuit.vue

@@ -1,5 +1,5 @@
 <template>
-
+  <CNotifAtTop />
   <div class="q-gutter-sm q-pa-sm q-pb-md">
     <div v-if="!circuit && !loading">
       <div v-if="mystatus === 403">
@@ -39,15 +39,12 @@
             <em style="font-weight: bold">{{ $t('db.youarerefusedcircuit') }}</em><br>
           </q-banner>
 
-          <CCurrencyValue
+          <CSaldo
             :symbol="circuit.symbol"
-            :tips="t('account.saldo_tips')"
             :color="circuit.color"
-            :value="account ? account.saldo : 0"
-            :label="t('account.saldo')">
-
-          </CCurrencyValue>
-
+            :saldo="saldo"
+            :qtarem="account ? qtarem : 0">
+          </CSaldo>
           <div>
             <q-btn
               v-if="!userStore.IsMyCircuitByName(circuit.name) && !userStore.IsAskedCircuitByName(circuit.name) && !userStore.IsRefusedCircuitByName(circuit.name)"
@@ -210,7 +207,7 @@
                       >
                       </CCurrencyValue>
                     </div>
-                    <div class="sezioni">
+                    <div class="sezioni" v-if="circuit.deperimento !== undefined">
                       <q-icon name="fas fa-battery-full"></q-icon>
                       {{ t('circuit.deperimento') }}: <span class="text-section">{{ circuit.deperimento ? t('dialog.yes') : t('dialog.no') }} {{ }}</span>
                     </div>