InfiniteScroll

Circuits

src/components/CGridTableRec/CGridTableRec.ts

@@ -248,6 +248,7 @@ export default defineComponent({
     const myrecdialog = ref(null)
 
     const startsearch = ref(false)
+    const clickbuttsearch = ref(false)
 
     const $router = useRouter()
 
@@ -283,7 +284,7 @@ export default defineComponent({
     const colclicksel = ref(null)
 
     const selected: any = ref([])
-    const showfilteradv = ref(false)  // filtri avanzati
+    const showfilter = ref(false)  // filtri avanzati
 
     const filter = ref(0)
     const filtergrp = ref(costanti.MY_GROUPS)
@@ -312,8 +313,8 @@ export default defineComponent({
       }
     })
 
-    watch(() => showfilteradv.value, (newval: any, from: any) => {
+    watch(() => showfilter.value, (newval: any, from: any) => {
-      tools.setCookie('s_adv', newval)
+      tools.setCookie('s_adv', newval ? '1' : '0')
     })
 
     watch(() => props.filtercustom, (to: any, from: any) => {
@@ -849,10 +850,10 @@ export default defineComponent({
       // calculate starting row of data
       const startRow = numRecLoaded.value
       const endRow = startRow + fetchCount
-      console.log('startRow', startRow, 'endRow', endRow, 'fetchCount', fetchCount)
+      console.log('startRow', startRow, 'endRow', endRow, 'rowsNumber', pagination.value.rowsNumber)
 
 
-      if (startRow < pagination.value.rowsNumber) {
+      if ((startRow < pagination.value.rowsNumber) || clickbuttsearch.value) {
 
         // fetch data from "server"
         return fetchFromServer(startRow, endRow, myfilternow, myfilterandnow, sortBy, descending).then((ris: any) => {
@@ -890,7 +891,7 @@ export default defineComponent({
           }
 
           console.log('   ...DONE ')
-          done()
+          done(pagination.value.rowsNumber === 0 ? true : false)
         })
       } else {
         startsearch.value = false
@@ -930,6 +931,7 @@ export default defineComponent({
     function refresh() {
       console.log('refresh', 'startsearch', startsearch.value)
 
+      clickbuttsearch.value = true
       // console.log('refresh')
       if (startsearch.value)
         return false
@@ -963,6 +965,7 @@ export default defineComponent({
         refresh_table()
       }
 
+      clickbuttsearch.value = false
     }
 
     watch(() => mycodeid.value, (newval, oldval) => {
@@ -1245,7 +1248,7 @@ export default defineComponent({
       myvertical.value = props.vertical
       // myvertical.value = tools.getCookie('myv_' + props.prop_mytable, props.vertical)
 
-      showfilteradv.value = tools.getCookie('s_adv', false)
+      showfilter.value = tools.getCookie('s_adv', '0') !== '0'
     }
 
     function mounted() {
@@ -1868,11 +1871,15 @@ export default defineComponent({
     function onLoadScroll (index: number, done: any) {
       if (index > 0) {
         console.log('onLoadScroll', index, 'RECLOAD', numRecLoaded.value, 'ROWS: ', pagination.value.rowsNumber)
-        if (numRecLoaded.value >= pagination.value.rowsNumber) {
+        if (numRecLoaded.value < pagination.value.rowsNumber || (pagination.value.rowsNumber <= 0 && clickbuttsearch.value)) {
-          done(true)
+          if (pagination.value.rowsNumber === 0) {
-        } else {
+            pagination.value.page = 0
+          }
+
           pagination.value.page = pagination.value.page + 1
           refresh_infscroll(done)
+        } else {
+          done(true)
         }
       }
     }
@@ -1956,7 +1963,7 @@ export default defineComponent({
       getValueExtra,
       shared_consts,
       getLabelFooterByRow,
-      showfilteradv,
+      showfilter,
       cmdExt,
       visupagedialog,
       myrecdialog,

src/components/CGridTableRec/CGridTableRec.vue

@@ -35,14 +35,16 @@
     </q-inner-loading>
 
     <div v-if="shared_consts.VERTIC_SHOW_GRID.includes(myvertical)">
-      <div v-if="searchList"
+      <div v-if="(prop_search || canEdit)" class="q-my-xs text-right">
-           :class="$q.screen.lt.sm ? `` : `row`  + ` text-blue `">
+        <q-btn size="sm" dense icon="fas fa-filter" :label="!showfilter ? $t('grid.showfilters') : $t('grid.hidefilters')"
+               @click="showfilter = !showfilter"></q-btn>
+      </div>
+      <q-slide-transition>
+        <div v-show="showfilter">
+          <div v-show="searchList"
+               :class="$q.screen.lt.sm ? `` : `row`  + ` text-blue `">
           <span v-for="(item, index) in searchList" :key="index">
 
-            <!--<div class="text-center q-my-xs" v-if="(item.type === costanti.FieldType.separator)">
-              <q-btn size="sm" dense :icon="!showfilteradv ? 'fas fa-arrow-down' : 'fas fa-arrow-up'" label="Filtri Avanzati" @click="showfilteradv = !showfilteradv"></q-btn>
-            </div>-->
-
             <CMySelect
               :col="fieldsTable.getColByColumns(mycolumns, item.key)"
               v-if="(item.type === costanti.FieldType.select) || (item.type === costanti.FieldType.select_by_server)"
@@ -150,7 +152,9 @@
 
             </q-select>
           </span>
-      </div>
+          </div>
+        </div>
+      </q-slide-transition>
 
       <div v-if="(prop_search || canEdit)"
            class="row justify-center vertical-middle">
@@ -162,8 +166,11 @@
 
             v-on:keyup.enter="doSearch"
           >
-            <template v-slot:after>
+            <template v-slot:prepend>
-              <q-btn v-if="mytable" dense label="" color="primary" @click="refresh" icon="search"></q-btn>
+              <q-icon name="search"/>
+            </template>
+            <template v-if="searchList" v-slot:after>
+              <q-btn dense label="" color="primary" @click="showfilter = !showfilter" icon="fas fa-filter"></q-btn>
             </template>
           </q-input>
         </div>
@@ -191,48 +198,47 @@
       <div v-if="pagination.rowsNumber === 1 && prop_search">{{ pagination.rowsNumber }} elemento trovato</div>
       <div v-if="pagination.rowsNumber > 1 && prop_search">{{ pagination.rowsNumber }} elementi trovati</div>
     </div>
-    numRecLoaded: {{numRecLoaded}}
-      <q-infinite-scroll
-        ref="myinfscroll"
-        v-if="shared_consts.VERTIC_SHOW_GRID.includes(myvertical)"
-        initial-index="0"
-        @load="onLoadScroll" :offset="350"
-        debounce="300"
 
-      >
+    <q-infinite-scroll
-        INFINITE: <br />
+      ref="myinfscroll"
+      v-if="shared_consts.VERTIC_SHOW_GRID.includes(myvertical)"
+      :initial-index="0"
+      @load="onLoadScroll" :offset="350"
+      debounce="300"
 
-        <div v-for="(row, index) in serverData" :key="index" class="caption">
+    >
-          <div v-if="row && shared_consts.TABLES_WITH_DATE.includes(tablesel)">
 
-            <div v-if="row.dateTimeStart && (tools.getstrVeryShortDate(row.dateTimeStart) !== actual)" class="actualdate">
+      <div v-for="(row, index) in serverData" :key="index" class="caption">
-              <span style="display: none">{{ actual = tools.getstrVeryShortDate(row.dateTimeStart) }}</span>
+        <div v-if="row && shared_consts.TABLES_WITH_DATE.includes(tablesel)">
-              <q-chip class="text-center shadow-5 glossy bg-orange" icon="fas fa-calendar-day">{{ tools.getstrDateLong(row.dateTimeStart) }}</q-chip>
+
-            </div>
+          <div v-if="row.dateTimeStart && (tools.getstrVeryShortDate(row.dateTimeStart) !== actual)" class="actualdate">
+            <span style="display: none">{{ actual = tools.getstrVeryShortDate(row.dateTimeStart) }}</span>
+            <q-chip class="text-center shadow-5 glossy bg-orange" icon="fas fa-calendar-day">{{ tools.getstrDateLong(row.dateTimeStart) }}</q-chip>
           </div>
-
-          <CMyRecGrpCard
-            v-if="tablesel === toolsext.TABMYGROUPS"
-            :table="tablesel"
-            :prop_myrec="row"
-            @cmdext="cmdExt"
-          >
-          </CMyRecGrpCard>
-          <CMyRecCard
-            v-else
-            :table="tablesel"
-            :prop_myrec="row"
-            @cmdext="cmdExt"
-          >
-          </CMyRecCard>
         </div>
-        <template v-slot:loading>
-          <div class="row justify-center q-my-md">
-            <q-spinner-dots color="primary" size="40px"/>
-          </div>
-        </template>
 
-      </q-infinite-scroll>
+        <CMyRecGrpCard
+          v-if="tablesel === toolsext.TABMYGROUPS"
+          :table="tablesel"
+          :prop_myrec="row"
+          @cmdext="cmdExt"
+        >
+        </CMyRecGrpCard>
+        <CMyRecCard
+          v-else
+          :table="tablesel"
+          :prop_myrec="row"
+          @cmdext="cmdExt"
+        >
+        </CMyRecCard>
+      </div>
+      <template v-slot:loading>
+        <div class="row justify-center q-my-md">
+          <q-spinner-dots color="primary" size="40px"/>
+        </div>
+      </template>
+
+    </q-infinite-scroll>
     <q-table
       v-else
       :grid="shared_consts.VERTIC_SHOW_GRID.includes(myvertical)"
@@ -243,12 +249,8 @@
       :rows="serverData"
       :columns="mycolumns"
       :filter="myfilter"
-      v-model:pagination="pagination2"
+      v-model:pagination="pagination"
       virtual-scroll
-      :virtual-scroll-item-size="48"
-      :virtual-scroll-sticky-size-start="48"
-      @virtual-scroll="onScroll"
-      :rows-per-page-options="[0]"
       :row-key="colkey"
       :loading="loading"
       @selection="selectionclick"

src/components/CMyFriends/CMyFriends.ts

@@ -56,6 +56,7 @@ export default defineComponent({
     const { t } = useI18n()
 
     const username = ref('')
+    const spinner_visible = ref(false)
     const listTrusted = ref(<IUserFields[]>[])
 
     const filtroutente = ref(<any[]>[])
@@ -154,12 +155,14 @@ export default defineComponent({
     function loadFriends() {
       // Carica il profilo di quest'utente
       if (username.value) {
+        spinner_visible.value = true
         userStore.loadFriends(username.value).then((ris) => {
           // console.log('ris', ris)
           if (ris) {
             listTrusted.value = ris.listTrusted ? ris.listTrusted : []
             filtroutente.value = [{ userId: userStore.my._id }]
           }
+          spinner_visible.value = false
         })
 
       }
@@ -237,6 +240,7 @@ export default defineComponent({
       setCmd,
       updateValue,
       myoptions,
+      spinner_visible,
     }
   }
 })

src/components/CMyFriends/CMyFriends.vue

@@ -16,6 +16,9 @@
       />
     </div>
     <div v-if="finder" class="">
+      <q-inner-loading :showing="spinner_visible">
+        <q-spinner-tail size="2em" color="primary"/>
+      </q-inner-loading>
 
       <div v-if="modelValue === costanti.FIND_PEOPLE">
         <slot></slot>

src/components/MyFooter/MyFooter.scss

@@ -0,0 +1,3 @@
+.q-tab__label {
+  font-size: 0.7rem !important;
+}

src/components/MyFooter/MyFooter.vue

@@ -5,31 +5,43 @@
     bordered
   >
     <q-tabs
-      class="text-grey-10 text-h6"
+      dense
+      class="text-grey-10 mylabfooter"
       active-color="primary"
+      no-caps
       indicator-color="transparent"
     >
       <q-route-tab
         to="/"
+        class="mylabfooter"
+        :label="$t('tabdown.home')"
         icon="fas fa-home"
       />
       <q-route-tab
         v-if="static_data.functionality.ENABLE_VIEW_GROUPS"
+        class="mylabfooter"
+        :label="$t('tabdown.groups')"
         to="/groups"
         icon="fas fa-users"
       />
       <q-route-tab
         v-if="static_data.functionality.ENABLE_VIEW_USERS"
+        class="mylabfooter"
+        :label="$t('tabdown.friends')"
         to="/friends"
         icon="fas fa-user-friends"
       />
       <q-route-tab
         v-if="static_data.functionality.ENABLE_VIEW_BOOKINGS"
+        class="mylabfooter"
+        :label="$t('tabdown.bookings')"
         to="/admin/eventlist"
         icon="fas fa-calendar-plus"
       />
       <q-route-tab
         v-if="static_data.functionality.ENABLE_VIEW_PROFILE"
+        class="mylabfooter"
+        :label="$t('tabdown.profile')"
         :to="`/my/`+getMyUsername()"
         icon="person"
       />
@@ -40,6 +52,6 @@
 <script lang="ts" src="./MyFooter.ts">
 </script>
 
-<style lang="scss" scoped>
+<style lang="scss">
 @import './MyFooter.scss';
 </style>

src/model/GlobalStore.ts

@@ -883,12 +883,17 @@ export interface IMyHosp extends IMyMain {
   date_updated?: Date,
 }
 
+export interface ICircuitList {
+  Num: number,
+  inscription_date?: Date
+}
 
 export interface ICircuit {
   _id: number
+  groupnameId: string
   name: string
   subname: string
-  descr: string
+  longdescr: string
   systemUserDescr: string
   systemUserId: string
   founderUserId: string

src/model/UserStore.ts

@@ -1,6 +1,6 @@
 import { IToken } from '@model/other'
 import { ICart, IOrderCart, IShareWithUs } from '@src/model/Products'
-import { IGallery, IImgGallery } from '@model/GlobalStore'
+import { ICircuit, ICircuitList, IGallery, IImgGallery } from '@model/GlobalStore'
 
 const enum ESexType {
   None = 0,
@@ -30,6 +30,7 @@ export interface IMyGroup {
   username_who_block?: string
   date_blocked?: Date
   createdBy?: string
+  circuits_list?: ICircuitList[]
 }
 
 export interface ICalcStat {

src/rootgen/admin/circuitsList/circuitsList.vue

@@ -3,7 +3,7 @@
     <CGridTableRec
       prop_mytable="circuits"
       prop_mytitle="Lista Circuiti"
-      :prop_mycolumns="fieldsTable.circuitslist()"
+      :prop_mycolumns="fieldsTable.circuitslistcomplete()"
       prop_colkey="_id"
       nodataLabel="Nessun Circuito"
       noresultLabel="Il filtro selezionato non ha trovato nessun risultato"

src/statics/lang/it.js

@@ -17,6 +17,8 @@ const msg_it = {
       columns: 'Colonne',
       tableslist: 'Tabelle',
       nodata: 'Nessun Dato',
+      showfilters: 'Mostra Filtri',
+      hidefilters: 'Nascondi Filtri',
     },
     gallery: {
       author_username: 'Utente',
@@ -1011,6 +1013,7 @@ const msg_it = {
       report_user: 'Segnala Utente',
     },
     groups: {
+      info1: 'Info',
       info: 'Informazioni su questo gruppo',
       member: 'membro',
       members: 'membri',
@@ -1041,6 +1044,8 @@ const msg_it = {
       hidden: 'Nascosto',
       private_descr: 'Solo i membri possono vedere chi fa parte del gruppo',
       hidden_descr: 'il Gruppo non sarà visibile nella ricerca',
+      page: 'Pagina',
+      circuits: 'Circuiti',
     },
     finder: {
       search_skill: 'Cerca una specializzazione'
@@ -1126,8 +1131,15 @@ const msg_it = {
     editor: {
       showtool: 'Mostra strumenti per formattare il testo',
       hidetool: 'Nascondi strumenti per formattare il testo',
-    }
+    },
 
+    tabdown: {
+      home: 'Home',
+      groups: 'Gruppi',
+      friends: 'Amici',
+      bookings: 'Prenotaz.',
+      profile: 'Profilo',
+    }
   },
 
 };

src/store/Modules/fieldsTable.ts

@@ -2387,11 +2387,12 @@ export const colTableSubCashCategory = [
   AddCol({ name: 'notes', label_trans: 'reg.note' }),
 ]
 
-export const colTableCircuit = [
+export const colTableCircuitComplete = [
   AddCol({ name: 'Num', label_trans: 'circuit.num', fieldtype: costanti.FieldType.number }),
+  AddCol({ name: 'groupnameId', label_trans: 'circuit.groupnameId' }),  // da togliere poi
   AddCol({ name: 'name', label_trans: 'circuit.name' }),
   AddCol({ name: 'subname', label_trans: 'circuit.subname' }),
-  AddCol({ name: 'descr', label_trans: 'circuit.descr' }),
+  AddCol({ name: 'longdescr', label_trans: 'circuit.descr', fieldtype: costanti.FieldType.html }),
   AddCol({ name: 'systemUserDescr', label_trans: 'circuit.systemUserDescr' }),
   AddCol({ name: 'systemUserId', label_trans: 'circuit.systemUserId', fieldtype: costanti.FieldType.select, jointable: 'users', }),
   AddCol({ name: 'founderUserId', label_trans: 'circuit.founderUserId', fieldtype: costanti.FieldType.select, jointable: 'users', }),
@@ -2418,6 +2419,21 @@ export const colTableCircuit = [
   AddCol(DuplicateRec),
 ]
 
+export const colTableCircuit = [
+  AddCol({ name: 'groupnameId', label_trans: 'circuit.groupnameId' }),  // da togliere poi
+  AddCol({ name: 'name', label_trans: 'circuit.name' }),
+  AddCol({ name: 'subname', label_trans: 'circuit.subname' }),
+  AddCol({ name: 'longdescr', label_trans: 'circuit.descr', fieldtype: costanti.FieldType.html }),
+  AddCol({ name: 'systemUserId', label_trans: 'circuit.systemUserId', fieldtype: costanti.FieldType.select, jointable: 'users', }),
+  AddCol({ name: 'founderUserId', label_trans: 'circuit.founderUserId', fieldtype: costanti.FieldType.select, jointable: 'users', }),
+  AddCol({ name: 'nome_valuta', label_trans: 'circuit.nome_valuta' }),
+  AddCol({ name: 'symbol', label_trans: 'circuit.symbol' }),
+  AddCol({ name: 'data_costituz', label_trans: 'circuit.data_costituz', fieldtype: costanti.FieldType.date }),
+  AddCol({ name: 'img_logo', label_trans: 'circuit.img_logo' }),
+  AddCol(DeleteRec),
+  AddCol(DuplicateRec),
+]
+
 export const colTableAccount = [
   AddCol({ name: 'circuitId', label_trans: 'account.circuitId', fieldtype: costanti.FieldType.number }),
   AddCol({ name: 'userId', label_trans: 'account.users', fieldtype: costanti.FieldType.select, jointable: 'users', }),
@@ -2549,6 +2565,10 @@ export const fieldsTable = {
     'myhosps',
   ],
 
+  circuitslistcomplete() {
+    return colTableCircuitComplete
+  },
+
   circuitslist() {
     return colTableCircuit
   },

src/views/user/myfriends/myfriends.ts

@@ -88,7 +88,7 @@ export default defineComponent({
       filtercustom.value = []
       arrfilterand.value = []
 
-      const filt_loaded = tools.getCookie(tools.COOK_SEARCH + tools.FRIENDS_SEARCH)
+      const filt_loaded = tools.getCookie(tools.COOK_SEARCH + tools.FRIENDS_SEARCH, costanti.FIND_PEOPLE, true)
       filter.value = filt_loaded ? filt_loaded : costanti.FIND_PEOPLE
     }
     watch(() => filter.value, (newval: any, oldval) => {

src/views/user/mygroup/mygroup.vue

@@ -100,10 +100,11 @@
           -->
 
           <q-tabs v-model="tabgrp" class="text-blue">
-            <q-tab label="Info" name="info" icon="fas fa-info"></q-tab>
+            <q-tab :label="t('groups.info1')" name="info" icon="fas fa-info"></q-tab>
-            <q-tab v-if="!!mygrp.note" label="Pagina" name="page" icon="fas fa-file-word"></q-tab>
+            <q-tab v-if="!!mygrp.note" :label="t('groups.page')" name="page" icon="fas fa-file-word"></q-tab>
             <q-tab v-if="tools.iCanShowGroupsMember(mygrp) || tools.iAmAdminGroup(groupname)"
-                   :label="t('groups.subscribes')" name="membri" icon="fas fa-users"></q-tab>
+                   :label="t('groups.subscribes')" name="members" icon="fas fa-users"></q-tab>
+            <q-tab :label="t('groups.circuits')" name="circuits" icon="fas fa-coins"></q-tab>
           </q-tabs>
 
           <q-tab-panels v-model="tabgrp" animated>
@@ -234,7 +235,10 @@
               </div>
             </q-tab-panel>
 
-            <q-tab-panel name="membri" style="max-width: 400px;" v-if="tools.iCanShowGroupsMember(mygrp)">
+            <q-tab-panel name="circuits">
+
+            </q-tab-panel>
+            <q-tab-panel name="members" style="max-width: 400px;" v-if="tools.iCanShowGroupsMember(mygrp)">
 
               <q-tabs v-model="tabmembers" class="text-blue">
                 <q-tab label="Tutti" name="all" icon="fas fa-users"></q-tab>