+ Registered Users

+ UsersList Online
This commit is contained in:
Surya Paolo
2022-12-10 02:01:26 +01:00
parent aeeba5a6b9
commit cd31d2d020
18 changed files with 364 additions and 72 deletions

View File

@@ -1,25 +1,44 @@
<template>
<div>
<div v-if="visustat">
<CTitleBanner class="q-pa-xs" :title="$t('pages.status')" bgcolor="bg-primary" clcolor="text-white"
mystyle="" myclass="myshad" :canopen="true">
<CTitleBanner
class="q-pa-xs"
:title="$t('pages.status')"
bgcolor="bg-primary"
clcolor="text-white"
mystyle=""
myclass="myshad"
:canopen="true"
>
<div class="flex flex-center">
<CElemStat
:title="$t('pages.statusreg.reg')"
icon="fas fa-users"
:value_today="datastat.num_reg_today"
:mytextval="datastat.num_reg"
classColor="text-blue"
colBack="green"
>
</CElemStat>
<CCardState :mytext="$t('pages.statusreg.reg')" :myval="datastat.num_teleg_attivo"
mycolor="blue"
:myperc="(datastat.num_teleg_attivo / datastat.num_reg) * 100"></CCardState>
<CCardState :mytext="$t('pages.statusreg.online_today')" :myval="datastat.online_today"
mycolor="green" :myperc="(datastat.online_today / datastat.num_reg) * 100"></CCardState>
<CElemStat
:title="$t('pages.statusreg.online_today')"
icon="fas fa-wifi"
:mytextval="datastat.online_today"
classColor="text-green"
colBack="red"
>
</CElemStat>
<!--<CCardState :mytext="$t('pages.statusreg.autorizzare')" :myval="datastat.num_autorizzare"
mycolor="yellow" :myperc="(datastat.num_autorizzare / datastat.num_teleg_attivo) * 100"></CCardState>
-->
<div class="q-pa-xs" v-if="datastat.num_part_accepted > 1">
<CCardStat :mytext="$t('stat.accepted')" :myval="datastat.num_part_accepted"></CCardStat>
<CCardStat
:mytext="$t('stat.accepted')"
:myval="datastat.num_part_accepted"
></CCardStat>
<!--<CCardStat :mytext="$t('stat.modalita_pagamento')"
:myval="datastat.num_modalita_pagamento"></CCardStat>-->
<!--<CCardStat :mytext="$t('stat.requisiti')" :myval="datastat.num_requisiti"></CCardStat>-->
@@ -34,49 +53,96 @@
</div>
<div class="column animazione">
<div class="text-center">{{$t('pages.statusreg.newreg')}}</div>
<transition-group name="fade" mode="out-in"
appear
enter-active-class="animazione fadeIn"
leave-active-class="animazione fadeOut">
<q-tabs v-model="mytab" class="text-blue">
<q-tab name="reg" :label="$t('pages.statusreg.newreg')" />
<q-tab name="online" :label="$t('pages.statusreg.onlineusers')" />
</q-tabs>
<q-item v-for="(user, index) in lastsreg" :key="index" class="q-mb-xs animated"
v-ripple>
<q-tab-panels v-model="mytab" animated>
<q-tab-panel name="reg">
<transition-group
name="fade"
mode="out-in"
appear
enter-active-class="animazione fadeIn"
leave-active-class="animazione fadeOut"
>
<q-item
v-for="(user, index) in lastsreg"
:key="index"
class="animated"
v-ripple
>
<q-item-section>
<q-item-label lines="1">
<CMyFieldRec
table="users"
:id="user._id"
:rec="user"
field="username"
:canEdit="false"
:canModify="false"
:fieldtype="costanti.FieldType.username_chip"
>
</CMyFieldRec>
</q-item-label>
</q-item-section>
<!--
<q-item-section avatar>
<q-avatar v-if="tools.geticon(user.profile.nationality)"
:class="tools.geticon(user.profile.nationality)">
</q-avatar>
<q-avatar v-else color="primary" text-color="white" class="text-center">
{{ tools.capitalize(user.profile.nationality) }}
</q-avatar>
</q-item-section>-->
<q-item-section>
<q-item-label lines="1">
<CMyFieldRec
table="users"
:id="user._id"
:rec="user"
field="username"
:canEdit="false"
:canModify="false"
:fieldtype="costanti.FieldType.username_chip">
</CMyFieldRec>
</q-item-label>
</q-item-section>
<q-item-section side>
<q-item-label>{{ tools.getstrDateTimeShort(user.date_reg) }}</q-item-label>
<q-chip outline color="green" text-color="white" icon-right="fas fa-user-plus"
size="xs"></q-chip>
</q-item-section>
</q-item>
</transition-group>
<q-item-section side>
<q-item-label>{{
tools.getstrDateTimeShort(user.date_reg)
}}</q-item-label>
</q-item-section>
</q-item>
</transition-group>
</q-tab-panel>
<q-tab-panel name="online">
<div class="q-pa-md" style="max-width: 300px">
<q-list bordered>
<transition-group
name="fade"
mode="out-in"
appear
enter-active-class="animazione fadeIn"
leave-active-class="animazione fadeOut"
>
<q-item
v-for="(user, index) in lastsonline"
:key="index"
class="animated chip_shadow q-ma-sm"
clickable
v-ripple
@click="gotoPage(`/my/${user.username}`)"
>
<q-item-section avatar>
<q-avatar round size="48px">
<img :src="getImgUserByUsername(user.username)" />
<q-badge
v-if="tools.isUserOnline(user)"
align="top"
floating
color="green"
>online</q-badge
>
</q-avatar>
</q-item-section>
<q-item-section class="">
<q-item-label>{{
tools.getNameToShow(user)
}}</q-item-label>
<q-item-label caption>{{
tools.getUserNameOnlyIfToShow(user)
}}</q-item-label>
</q-item-section>
<q-item-section side>{{
tools.timeAgo(user.lasttimeonline)
}}</q-item-section>
</q-item>
</transition-group>
</q-list>
</div>
</q-tab-panel>
</q-tab-panels>
</div>
<!--<CGeoChart :mydata="datastat.arr_nations">
@@ -91,15 +157,19 @@
</CListNationality>
</div>-->
<div class="clBorderTutor">
<CLineChart :mydata="datastat.reg_daily" :title="$t('stat.reg_daily')" color="blue" bordercolor="blue" :sum="true">
<CLineChart
:mydata="datastat.reg_daily"
:title="$t('stat.reg_daily')"
color="blue"
bordercolor="blue"
:sum="true"
>
</CLineChart>
<!--<CLineChart :mydata="datastat.reg_weekly" :title="$t('stat.reg_weekly')" color="blue" bordercolor="green" :sum="true">
</CLineChart>-->
<!--<CLineChart :mydata="datastat.reg_daily" :title="$t('stat.reg_total')"
:offset="datastat.numreg_untilday" :sum="true"
:mycolors="['#0b0', '#666']">
@@ -117,5 +187,5 @@
</script>
<style lang="scss" scoped>
@import './CStatusReg.scss';
@import './CStatusReg.scss';
</style>