Visu Sent Monete

src/components/CNotifAtTop/CNotifAtTop.ts

@@ -0,0 +1,75 @@
+import { defineComponent, onMounted, PropType, ref, watch } from 'vue'
+import { useQuasar } from 'quasar'
+import { useI18n } from '@/boot/i18n'
+import { useGlobalStore } from '@store/globalStore'
+import { useUserStore } from '@store/UserStore'
+import { fieldsTable } from '@store/Modules/fieldsTable'
+import { tools } from '@store/Modules/tools'
+import { costanti } from '@costanti'
+import { shared_consts } from '@/common/shared_vuejs'
+import { CMyFieldDb } from '@/components/CMyFieldDb'
+import { CDateTime } from '@/components/CDateTime'
+import { toolsext } from '@src/store/Modules/toolsext'
+import { computed } from 'vue'
+import { INotif } from 'model'
+import { useNotifStore } from '@store/NotifStore'
+import { useCircuitStore } from '@store/CircuitStore'
+import { useRouter } from 'vue-router'
+import MixinUsers from '@/mixins/mixin-users'
+
+export default defineComponent({
+  name: 'CNotifAtTop',
+  props: {
+  },
+  components: {  },
+  setup(props, { emit }) {
+    const q = useQuasar()
+    const { t } = useI18n()
+    const globalStore = useGlobalStore()
+    const userStore = useUserStore()
+    const notifStore = useNotifStore()
+    const circuitStore = useCircuitStore()
+    const $router = useRouter()
+
+    const { getImgByNotif, getNotifText, getTypeDirNotif, getTypeIdNotif } = MixinUsers()
+
+    const lasts_notifs_req = computed(() => notifStore.getnotifs_coinsreq())
+    const num_notifs = computed(() => lasts_notifs_req.value.length)
+
+    function mounted() {
+      //
+    }
+
+    function clickNotif(notif: INotif) {
+      if (notif.openUrl) {
+        let mylink = tools.updateQueryStringParameter(notif.openUrl, 'idnotif', notif._id)
+        console.log('mylink', mylink, notif._id)
+        if (mylink) {
+          $router.replace(mylink)
+        }
+      }
+    }
+
+
+    onMounted(mounted)
+
+    return {
+      q,
+      t,
+      getImgByNotif,
+      getNotifText,
+      getTypeDirNotif,
+      getTypeIdNotif,
+      tools,
+      costanti,
+      shared_consts,
+      fieldsTable,
+      globalStore,
+      toolsext,
+      lasts_notifs_req,
+      num_notifs,
+      clickNotif,
+    }
+  },
+})
+

src/components/CNotifAtTop/CNotifAtTop.vue

@@ -0,0 +1,58 @@
+<template>
+  <q-banner
+    v-if="num_notifs > 0"
+    rounded
+    dense
+    class="bg-primary text-white"
+    color="primary q-title"
+    style="text-align: center;">
+    <template v-slot:avatar>
+      <q-icon name="fas fa-exclamation-triangle" color="yellow" size="xs" />
+    </template>
+    <q-item clickable v-for="(notif, index) in lasts_notifs_req" :key="index">
+
+      <!--<q-item-section avatar>
+        <q-avatar>
+          <q-item-label lines="1">{{ getTypeDirNotif(notif) }}</q-item-label>
+        </q-avatar>
+      </q-item-section>-->
+
+      <q-item-section avatar>
+        <q-avatar>
+          <img :src="notif.myimgsender" :alt="notif.sender">
+        </q-avatar>
+      </q-item-section>
+
+
+      <q-item-section v-ripple>
+        <q-item-label lines="5" :class="(!notif.read) ? 'unread' : 'read'" @click="clickNotif(notif)">
+          <div v-html="getNotifText($t, notif, false)"></div>
+        </q-item-label>
+        <q-item-label caption lines="2"
+                      v-if="notif.typedir === shared_consts.TypeNotifs.TYPEDIR_CIRCUITS && notif.status === 0 && notif.typeid === shared_consts.TypeNotifs.ID_CIRCUIT_SENDCOINSREQ"
+                      v-ripple>
+          <div class="row no-wrap justify-evenly q-pa-sm">
+            <q-btn
+              size="md"
+              icon="fas fa-coins"
+              color="positive" :label="$t('circuit.accept_coins_qty', {qty: notif.extrarec.qty, symbol: notif.extrarec.symbol})"
+              @click="tools.acceptCoins(q, notif.sender, notif)"
+            />
+            <q-btn
+              size="md"
+              color="negative" :label="$t('circuit.refuse_coins_qty', {qty: notif.extrarec.qty, symbol: notif.extrarec.symbol})"
+              @click="tools.refuseCoins(q, notif.sender, notif.extrarec)"
+            />
+          </div>
+        </q-item-label>
+      </q-item-section>
+    </q-item>
+  </q-banner>
+</template>
+
+<script lang="ts" src="./CNotifAtTop.ts">
+</script>
+
+<style lang="scss" scoped>
+@import './CNotifAtTop.scss';
+</style>

src/components/CNotifAtTop/index.ts

@@ -0,0 +1 @@
+export {default as CNotifAtTop} from './CNotifAtTop.vue'