surya/myprojplanet_vite
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

InfiniteScroll: Le liste (Beni / Servizi / Eventi) devono essere caricate in automatico, scorrendo la lista...

Browse Source 
fix category
This commit is contained in:
paoloar77
2022-08-15 15:10:00 +02:00
parent 0b6188699e
commit c93361dfa2
38 changed files with 1051 additions and 328 deletions
Download Patch File Download Diff File Expand all files Collapse all files

231
src/components/CGridTableRec/CGridTableRec.vue
View File

@@ -33,7 +33,208 @@
<q-inner-loading :showing="spinner_visible">
<q-spinner-tail size="2em" color="primary"/>
</q-inner-loading>
<div v-if="shared_consts.VERTIC_SHOW_GRID.includes(myvertical)">
<div v-if="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)"
:label="labelcombo(item)"
v-model:value="item.value"
@update:value="searchval(item.value, item.table)"
:addall="item.addall"
:addnone="item.addnone"
:tablesel="item.type === costanti.FieldType.select_by_server ? item.tablesel : ''"
:pickup="item.type === costanti.FieldType.select_by_server"
label-color="primary"
class="combowidth"
color="primary"
:icon_alternative="item.icon"
:optval="fieldsTable.getKeyByTable(item.table)"
:optlab="fieldsTable.getLabelByTable(item.table)"
:options="valoriopt(item, false)"
:filter="item.filter"
:filter_extra="item.filter_extra"
:useinput="item.useinput && item.type !== costanti.FieldType.select_by_server">
</CMySelect>
<!--<div v-if="item.type === costanti.FieldType.multiselect_by_server">
item: {{ item}}
</div>-->
<CMySelect
v-if="item.type === costanti.FieldType.multiselect_by_server"
:col="fieldsTable.getColByColumns(mycolumns, item.key)"
:multiselect_by_server="true"
:label="labelcombo(item)"
v-model:arrvalue="item.arrvalue"
@update:arrvalue="searchval(item.arrvalue, item.table)"
:addall="item.addall"
:addnone="item.addnone"
:tablesel="item.tablesel"
:pickup="true"
:param1="item.param1"
label-color="primary"
class="combowidth"
color="primary"
:icon_alternative="item.icon"
:optval="fieldsTable.getKeyByTable(item.table)"
:optlab="fieldsTable.getLabelByTable(item.table)"
:filter="item.filter"
:filter_extra="item.filter_extra"
:options="valoriopt(item, false)"
:useinput="true">
</CMySelect>
<q-select
v-if="(item.type === costanti.FieldType.multiselect)"
v-model="item.arrvalue"
label-color="primary"
:label="labelcombo(item)"
@update:model-value="searchval(item.arrvalue, item.table)"
rounded
dense
outlined
multiple
options-dense
emit-value
map-options
stack-label
:useinput="item.useinput"
:options="valoriopt(item, item.addall, item.addnone)"
:filter="item.filter"
class="combowidth"
:option-value="fieldsTable.getKeyByTable(item.table)"
>
<template v-if="item.icon" v-slot:prepend>
<q-icon :name="item.icon"/>
</template>
<template
v-if="item.arrvalue.length >= 1"
v-slot:selected-item="scope">
<div
v-if="scope.opt[fieldsTable.getLabelByTable(item.table)] || (scope.opt && checkIfShowRec(scope.opt)) ">
<q-chip
removable
dense
@remove="scope.removeAtIndex(scope.index)"
v-if="checkIfShowRec(scope.opt)"
color="white"
text-color="mycol"
class="q-my-none q-ml-xs q-mr-none"
>
<q-avatar color="primary" text-color="white" :icon="item.icon" size="12px"/>
{{ scope.opt[fieldsTable.getLabelByTable(item.table)] || (scope.opt) }}
</q-chip>
</div>
</template>
<template v-slot:option="{ itemProps, opt, selected, toggleOption }">
<q-item v-bind="itemProps">
<q-item-section>
<q-item-label>{{ opt[fieldsTable.getLabelByTable(item.table)] }}</q-item-label>
</q-item-section>
<q-item-section side>
<q-toggle :model-value="selected" @update:model-value="toggleOption(opt)"/>
</q-item-section>
</q-item>
</template>
</q-select>
</span>
</div>
<div v-if="(prop_search || canEdit)"
class="row justify-center vertical-middle">
<div v-if="prop_search" class="q-mr-sm full-width">
<q-input
v-model="search" filled dense type="search" debounce="500" :hint="hint"
label="Cerca"
v-on:keyup.enter="doSearch"
>
<template v-slot:after>
<q-btn v-if="mytable" dense label="" color="primary" @click="refresh" icon="search"></q-btn>
</template>
</q-input>
</div>
<q-space></q-space>
<q-select
v-if="mytable && pagination.rowsNumber > 0 && (prop_search || canEdit) && showCol && myvertical === 0"
v-model="colVisib"
rounded
outlined
multiple
dense
options-dense
:display-value="$t('grid.columns')"
emit-value
map-options
:options="mycolumns"
option-value="name"
@update:model-value="changeCol">
</q-select>
</div>
<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"
>
INFINITE: <br />
<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">
<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>
</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>
<q-table
v-else
:grid="shared_consts.VERTIC_SHOW_GRID.includes(myvertical)"
:grid-header="shared_consts.VERTIC_SHOW_GRID.includes(myvertical) && shared_consts.TABLES_WITH_SORTING.includes(mytable)"
flat
@@ -42,10 +243,14 @@
:rows="serverData"
:columns="mycolumns"
:filter="myfilter"
v-model:pagination="pagination"
v-model:pagination="pagination2"
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"
@request="onRequest"
@selection="selectionclick"
binary-state-sort
:visible-columns="colVisib"
@@ -98,7 +303,7 @@
</template>
<template v-slot:top-right v-if="tablesList || arrfilters">
<span style="display: none">{{actual = null}}</span>
<span style="display: none">{{ actual = null }}</span>
<q-select
v-if="tablesList"
@@ -291,17 +496,15 @@
<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 v-if="choose_visutype" class="">
<q-radio v-model="myvertical" :val="2" label="Lista"
@update:model-value="tools.setCookie('myv_' + prop_mytable, myvertical) "/>
<q-radio v-if="mytable === toolsext.TAB" v-model="myvertical" :val="costanti.VISUTABLE_SCHEDA_GROUP"
<div v-if="choose_visutype && $q.screen.gt.xs && isAdmin()" class="">
<q-radio v-model="myvertical" :val="2" label="Lista"/>
<!--<q-radio v-if="mytable === toolsext.TAB" v-model="myvertical" :val="costanti.VISUTABLE_SCHEDA_GROUP"
label="Scheda"
@update:model-value="tools.setCookie('myv_' + prop_mytable, myvertical) "/>
<q-radio v-else-if="mytable !== toolsext.TABMYGROUPS && !finder" v-model="myvertical"
:val="costanti.VISUTABLE_SCHEDA_USER" label="Scheda"
@update:model-value="tools.setCookie('myv_' + prop_mytable, myvertical) "/>
<q-radio v-if="$q.screen.gt.xs" v-model="myvertical" :val="0" label="Tabella"
@update:model-value="tools.setCookie('myv_' + prop_mytable, myvertical) "/>
:val="costanti.VISUTABLE_SCHEDA_USER" slabel="Scheda"
@update:model-value="tools.setCookie('myv_' + prop_mytable, myvertical) "/>-->
<q-radio v-if="$q.screen.gt.xs" v-model="myvertical" :val="0" label="Tabella"/>
</div>
</template>
@@ -357,8 +560,8 @@
<div v-if="props.row && shared_consts.TABLES_WITH_DATE.includes(tablesel)">
<div v-if="props.row.dateTimeStart && (tools.getstrVeryShortDate(props.row.dateTimeStart) !== actual)" class="actualdate">
<span style="display: none">{{actual = tools.getstrVeryShortDate(props.row.dateTimeStart)}}</span>
<q-chip class="text-center shadow-5 glossy bg-orange" icon="fas fa-calendar-day">{{tools.getstrDateLong(props.row.dateTimeStart) }}</q-chip>
<span style="display: none">{{ actual = tools.getstrVeryShortDate(props.row.dateTimeStart) }}</span>
<q-chip class="text-center shadow-5 glossy bg-orange" icon="fas fa-calendar-day">{{ tools.getstrDateLong(props.row.dateTimeStart) }}</q-chip>
</div>
</div>
@@ -611,7 +814,7 @@
label="Campi Avanzati" @click="showfilteradv = !showfilteradv"></q-btn>
</div>-->
<div
v-if="showColCheck(col, tools.TIPOVIS_EDIT_RECORD, false) && col.foredit">
v-if="showColCheck(col, tools.TIPOVIS_EDIT_RECORD, false) && col.foredit" class="tdclass">
<div>
<CMyPopupEdit
:table="mytable"