656 lines
23 KiB
Vue
Executable File
656 lines
23 KiB
Vue
Executable File
<template>
|
|
<div class="q-gutter-sm q-pa-sm q-pb-md">
|
|
<div v-if="!mygrp && !loading">
|
|
<div v-if="mystatus === 403">
|
|
<h3>
|
|
Non hai i permessi per accedere al Gruppo.<br />
|
|
|
|
Occorre prima registrarsi alla App
|
|
</h3>
|
|
</div>
|
|
<div v-else>
|
|
<h3>Gruppo non Esistente</h3>
|
|
</div>
|
|
</div>
|
|
<div v-else>
|
|
<div v-if="!tools.isLogged()">
|
|
<CCheckIfIsLogged></CCheckIfIsLogged>
|
|
</div>
|
|
<div>
|
|
<div
|
|
v-if="mygrp.descr"
|
|
class="fit column no-wrap justify-evenly items-center content-start"
|
|
>
|
|
<div class="">
|
|
<q-avatar size="140px">
|
|
<q-img
|
|
:src="getImgGrp()"
|
|
:alt="mygrpname()"
|
|
img-class="imgprofile"
|
|
height="140px"
|
|
@click="showPic = true"
|
|
/>
|
|
</q-avatar>
|
|
</div>
|
|
|
|
<div class="text-h6">
|
|
<span v-if="checkifShow('name')"> {{ mygrp.title }}</span>
|
|
</div>
|
|
<div
|
|
v-if="mygrp.title !== mygrp.groupname"
|
|
class="col-12 text-h7 text-blue text-shadow-2"
|
|
>
|
|
{{ mygrp.groupname }}
|
|
</div>
|
|
|
|
<q-banner
|
|
v-if="userStore.IsRefusedGroupByGroupname(mygrp.groupname)"
|
|
rounded
|
|
class="bg-red text-white"
|
|
style="text-align: center"
|
|
>
|
|
<em style="font-weight: bold">{{ $t('db.youarerefusedgroup') }}</em
|
|
><br />
|
|
</q-banner>
|
|
|
|
<div>
|
|
<q-btn
|
|
v-if="
|
|
!userStore.IsMyGroupByGroupname(mygrp.groupname) &&
|
|
!userStore.IsAskedGroupByGroupname(mygrp.groupname) &&
|
|
!userStore.IsRefusedGroupByGroupname(mygrp.groupname)
|
|
"
|
|
icon="fas fa-user-plus"
|
|
color="primary"
|
|
:label="$t('groups.ask_group')"
|
|
@click="
|
|
tools.setRequestGroup(
|
|
$q,
|
|
userStore.my.username,
|
|
mygrp.groupname,
|
|
true
|
|
)
|
|
"
|
|
/>
|
|
<q-btn
|
|
v-if="userStore.IsMyGroupByGroupname(mygrp.groupname)"
|
|
rounded
|
|
icon="fas fa-ellipsis-h"
|
|
>
|
|
<q-menu>
|
|
<q-list v-if="true" style="min-width: 150px">
|
|
<q-item
|
|
v-if="userStore.IsMyGroupByGroupname(mygrp.groupname)"
|
|
clickable
|
|
v-close-popup
|
|
@click="
|
|
tools.removeFromMyGroups(
|
|
$q,
|
|
userStore.my.username,
|
|
mygrp.groupname,
|
|
$t('db.domanda_exit_fromgroup', {
|
|
groupname: mygrp.groupname,
|
|
})
|
|
)
|
|
"
|
|
>
|
|
<q-item-section avatar>
|
|
<q-icon color="negative" name="fas fa-user-minus" />
|
|
</q-item-section>
|
|
<q-item-section>{{
|
|
$t('groups.exit_group')
|
|
}}</q-item-section>
|
|
</q-item>
|
|
|
|
<q-list
|
|
v-if="
|
|
userStore.IsMyGroupByGroupname(mygrp.groupname) &&
|
|
tools.iAmAdminGroup(mygrp.groupname)
|
|
"
|
|
style="min-width: 200px"
|
|
>
|
|
<q-item
|
|
clickable
|
|
v-close-popup
|
|
@click="
|
|
tools.setCmd(
|
|
$q,
|
|
shared_consts.GROUPSCMD.DELETE_GROUP,
|
|
userStore.my.username,
|
|
'',
|
|
mygrp.groupname
|
|
)
|
|
"
|
|
>
|
|
<q-item-section avatar>
|
|
<q-icon color="negative" name="fas fa-trash-alt" />
|
|
</q-item-section>
|
|
<q-item-section>{{
|
|
$t('groups.delete_group')
|
|
}}</q-item-section>
|
|
</q-item>
|
|
</q-list>
|
|
</q-list>
|
|
</q-menu>
|
|
</q-btn>
|
|
|
|
<q-btn
|
|
v-if="
|
|
userStore.IsAskedGroupByGroupname(mygrp.groupname) &&
|
|
!userStore.IsMyGroupByGroupname(mygrp.groupname)
|
|
"
|
|
icon="fas fa-user-minus"
|
|
outline
|
|
flat
|
|
:label="$t('shared.cancel_ask_short')"
|
|
@click="
|
|
tools.cancelReqGroups(
|
|
$q,
|
|
userStore.my.username,
|
|
mygrp.groupname
|
|
)
|
|
"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div
|
|
v-if="mygrp.descr"
|
|
class="no-wrap justify-evenly items-center content-start"
|
|
>
|
|
<!--
|
|
<q-btn
|
|
v-if="tools.iAmAdminGroup(groupname)" icon="fas fa-pencil-alt"
|
|
color="blue"
|
|
size="md"
|
|
:label="$t('otherpages.modifgrp')"
|
|
to="/editgrp">
|
|
</q-btn>
|
|
-->
|
|
|
|
<q-tabs v-model="tabgrp" class="text-blue">
|
|
<q-tab
|
|
:label="t('shared.info1')"
|
|
name="info"
|
|
icon="fas fa-info"
|
|
></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('shared.subscribes')"
|
|
name="members"
|
|
icon="fas fa-users"
|
|
></q-tab>
|
|
<q-tab
|
|
v-if="
|
|
tools.iCanShowGroupsMember(mygrp) ||
|
|
tools.iAmAdminGroup(groupname)
|
|
"
|
|
:label="t('groups.circuits')"
|
|
name="circuits"
|
|
icon="fas fa-coins"
|
|
></q-tab>
|
|
</q-tabs>
|
|
|
|
<q-tab-panels v-model="tabgrp" animated>
|
|
<q-tab-panel name="info">
|
|
<div>
|
|
<q-card>
|
|
<q-card-section>
|
|
<div class="text-h6">{{ t('groups.info') }}</div>
|
|
</q-card-section>
|
|
|
|
<q-separator />
|
|
|
|
<q-card-section>
|
|
<div class="element">
|
|
<q-icon name="fas fa-lightbulb"></q-icon>
|
|
{{
|
|
$t('shared.createdby', {
|
|
username: mygrp.createdBy,
|
|
date: tools.getstrDateYY(mygrp.date_created),
|
|
})
|
|
}}
|
|
</div>
|
|
<div
|
|
v-if="
|
|
!!mygrp.date_updated &&
|
|
tools.getstrshortDate(mygrp.date_updated) !==
|
|
tools.getstrshortDate(mygrp.createdBy)
|
|
"
|
|
class="element"
|
|
>
|
|
<q-icon name="fas fa-pencil-alt"></q-icon>
|
|
{{
|
|
$t('shared.lastmodify', {
|
|
date: tools.getstrDateYY(mygrp.date_updated),
|
|
})
|
|
}}
|
|
</div>
|
|
|
|
<div
|
|
v-if="
|
|
mygrp.visibility.includes(
|
|
shared_consts.Visibility_Group.PRIVATE
|
|
)
|
|
"
|
|
class="row"
|
|
>
|
|
<div class="q-pa-xs">
|
|
<q-icon name="fas fa-lock"></q-icon>
|
|
</div>
|
|
<div>
|
|
<div class="title_param">
|
|
{{ $t('groups.private') }}
|
|
</div>
|
|
{{ $t('groups.private_descr') }}
|
|
</div>
|
|
</div>
|
|
|
|
<div
|
|
v-if="
|
|
mygrp.visibility.includes(
|
|
shared_consts.Visibility_Group.HIDDEN
|
|
)
|
|
"
|
|
class="row"
|
|
>
|
|
<div class="q-pa-xs">
|
|
<q-icon name="fas fa-eye-slash"></q-icon>
|
|
</div>
|
|
<div>
|
|
<div class="title_param">{{ $t('groups.hidden') }}</div>
|
|
{{ $t('groups.hidden_descr') }}
|
|
</div>
|
|
</div>
|
|
|
|
<div v-if="cities.length > 0" class="row">
|
|
<div class="q-pa-xs">
|
|
<q-icon name="fas fa-map-marker-alt"></q-icon>
|
|
</div>
|
|
<div>
|
|
<div class="title_param">
|
|
<div v-for="(city, index) of cities" :key="index">
|
|
{{ city.comune }} ({{ city.prov }})
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="members">
|
|
<q-icon name="fas fa-users"></q-icon>
|
|
{{ numUsers() }}
|
|
{{
|
|
numUsers() === 1
|
|
? t('shared.member')
|
|
: t('shared.members')
|
|
}}
|
|
</div>
|
|
<div class="admins">
|
|
<q-icon name="fas fa-user-cog"></q-icon>
|
|
{{ numAdmins() }}
|
|
{{
|
|
numAdmins() === 1
|
|
? t('shared.admin')
|
|
: t('shared.admins')
|
|
}}
|
|
</div>
|
|
<div v-for="(user, index) of mygrp.admins" :key="index">
|
|
<CMyUser
|
|
:mycontact="user"
|
|
:visu="costanti.FIND_PEOPLE"
|
|
@setCmd="tools.setCmd"
|
|
>
|
|
</CMyUser>
|
|
</div>
|
|
</q-card-section>
|
|
</q-card>
|
|
|
|
<br />
|
|
</div>
|
|
<q-card v-if="mygrp.title">
|
|
<q-card-section>
|
|
<div class="text-h6">Descrizione:</div>
|
|
</q-card-section>
|
|
<q-separator />
|
|
|
|
<q-card-section>
|
|
<div class="col-12 text-h7">
|
|
<span v-if="checkifShow('descr')">{{ mygrp.descr }}</span>
|
|
</div>
|
|
|
|
<div class="col-6 q-ma-xs">
|
|
<q-btn
|
|
v-if="getLinkGrpTelegram()"
|
|
icon="fab fa-telegram"
|
|
color="blue"
|
|
type="a"
|
|
size="md"
|
|
rounded
|
|
:label="$t('msgs.telegrammsg')"
|
|
:href="getLinkGrpTelegram()"
|
|
target="__blank"
|
|
>
|
|
</q-btn>
|
|
</div>
|
|
<div class="col-6 q-ma-xs">
|
|
<q-btn
|
|
v-if="getLinkWebSite()"
|
|
icon="fas fa-globe"
|
|
color="blue"
|
|
type="a"
|
|
size="md"
|
|
rounded
|
|
:label="$t('reg.website')"
|
|
:href="getLinkWebSite()"
|
|
target="__blank"
|
|
>
|
|
</q-btn>
|
|
</div>
|
|
</q-card-section>
|
|
</q-card>
|
|
</q-tab-panel>
|
|
|
|
<q-tab-panel name="page">
|
|
<div v-if="mygrp.note">
|
|
<br />
|
|
<div class="q-ma-sm q-gutter-sm q-pa-xs">
|
|
<div v-if="mygrp.note" v-html="mygrp.note"></div>
|
|
</div>
|
|
</div>
|
|
</q-tab-panel>
|
|
|
|
<q-tab-panel
|
|
name="members"
|
|
style="max-width: 500px"
|
|
v-if="tools.iCanShowGroupsMember(mygrp)"
|
|
>
|
|
<q-tabs
|
|
v-show="tools.iAmAdminGroup(groupname)"
|
|
v-model="tabmembers"
|
|
class="text-blue"
|
|
>
|
|
<q-tab label="Tutti" name="all" icon="fas fa-users"></q-tab>
|
|
<q-tab
|
|
v-if="tools.iAmAdminGroup(groupname)"
|
|
label="Richieste"
|
|
name="rich"
|
|
icon="fas fa-user-plus"
|
|
></q-tab>
|
|
<q-tab
|
|
v-if="tools.iAmAdminGroup(groupname)"
|
|
label="Rifiutati"
|
|
name="refused"
|
|
icon="fas fa-user-minus"
|
|
outline
|
|
></q-tab>
|
|
</q-tabs>
|
|
|
|
<q-tab-panels v-model="tabmembers" animated>
|
|
<q-tab-panel name="all">
|
|
<CGridTableRec
|
|
ref="tabMembri"
|
|
prop_mytable="users"
|
|
prop_mytitle=""
|
|
:prop_mycolumns="colmyUserPeople"
|
|
prop_colkey="_id"
|
|
col_title="username"
|
|
:vertical="costanti.VISUTABLE_LISTA"
|
|
nodataLabel="Nessun Iscritto"
|
|
:prop_search="true"
|
|
hint="Username da trovare"
|
|
:finder="false"
|
|
:choose_visutype="true"
|
|
:finder_noNull="false"
|
|
:options="shared_consts.OPTIONS_SEARCH_USER_ALL_WORDS"
|
|
:butt_modif_new="false"
|
|
noresultLabel="Username non trovato"
|
|
:arrfilters="arrfilterand"
|
|
:filtercustom="filtercustom"
|
|
:prop_searchList="searchList"
|
|
:showType="costanti.SHOW_USERINFO"
|
|
:showCol="false"
|
|
:extrafield="groupname"
|
|
:extraparams="extraparams()"
|
|
:visufind="
|
|
tools.iAmAdminGroup(groupname)
|
|
? costanti.REQ_REMOVE_USER_TO_GROUP
|
|
: costanti.FIND_PEOPLE
|
|
"
|
|
>
|
|
</CGridTableRec>
|
|
</q-tab-panel>
|
|
<q-tab-panel name="rich">
|
|
<CGridTableRec
|
|
prop_mytable="mygroups"
|
|
prop_mytitle=""
|
|
:prop_mycolumns="colmyUserPeople"
|
|
prop_colkey="_id"
|
|
col_title=""
|
|
:vertical="costanti.VISUTABLE_USER_TABGROUP"
|
|
nodataLabel="Nessuna Richiesta in sospeso"
|
|
:prop_search="false"
|
|
hint="Username da trovare"
|
|
:finder="false"
|
|
:choose_visutype="false"
|
|
:finder_noNull="false"
|
|
:options="shared_consts.OPTIONS_SEARCH_USER_ALL_WORDS"
|
|
:butt_modif_new="false"
|
|
noresultLabel="Username non trovato"
|
|
:arrfilters="arrfilterand"
|
|
:filtercustom="filtercustom_rich"
|
|
:prop_searchList="searchList"
|
|
:showType="costanti.SHOW_USERINFO"
|
|
keyMain=""
|
|
:showCol="false"
|
|
:extraparams="extraparams_rich()"
|
|
:extrafield="groupname"
|
|
:visufind="costanti.REQ_ADD_USER_TO_GROUP"
|
|
>
|
|
</CGridTableRec>
|
|
</q-tab-panel>
|
|
<q-tab-panel name="refused">
|
|
<CGridTableRec
|
|
prop_mytable="mygroups"
|
|
prop_mytitle=""
|
|
:prop_mycolumns="colmyUserPeople"
|
|
prop_colkey="_id"
|
|
col_title=""
|
|
:vertical="costanti.VISUTABLE_SCHEDA_GROUP"
|
|
nodataLabel="Nessun utente Rifiutato"
|
|
:prop_search="false"
|
|
hint="Username da trovare"
|
|
:finder="false"
|
|
:choose_visutype="false"
|
|
:finder_noNull="false"
|
|
:options="shared_consts.OPTIONS_SEARCH_USER_ALL_WORDS"
|
|
:butt_modif_new="false"
|
|
noresultLabel="Username non trovato"
|
|
:arrfilters="arrfilterand"
|
|
:filtercustom="filtercustom_rich"
|
|
:prop_searchList="searchList"
|
|
:showType="costanti.SHOW_USERINFO"
|
|
keyMain=""
|
|
:showCol="false"
|
|
:extraparams="extraparams_refused()"
|
|
:extrafield="groupname"
|
|
:visufind="costanti.REQ_ADD_USER_TO_GROUP"
|
|
>
|
|
</CGridTableRec>
|
|
</q-tab-panel>
|
|
</q-tab-panels>
|
|
</q-tab-panel>
|
|
<q-tab-panel name="circuits">
|
|
<q-select
|
|
v-model="circuitIndex"
|
|
:options="circuitslistOpt"
|
|
emit-value
|
|
map-options
|
|
:behavior="$q.platform.is.ios === true ? 'dialog' : 'menu'"
|
|
>
|
|
<template v-slot:prepend>
|
|
<q-icon :name="iconsel" />
|
|
</template>
|
|
<template v-slot:option="scope">
|
|
<q-item v-bind="scope.itemProps">
|
|
<q-item-section>
|
|
<q-item-label>{{ scope.opt.label }}</q-item-label>
|
|
</q-item-section>
|
|
</q-item>
|
|
</template>
|
|
</q-select>
|
|
|
|
<q-tabs v-model="tabcircuit" class="text-blue" no-caps>
|
|
<q-tab
|
|
:label="t('shared.info1')"
|
|
name="info"
|
|
icon="fas fa-info"
|
|
></q-tab>
|
|
<q-tab
|
|
:label="t('circuit.movements')"
|
|
name="mov"
|
|
icon="fas fa-coins"
|
|
></q-tab>
|
|
</q-tabs>
|
|
</q-tab-panel>
|
|
</q-tab-panels>
|
|
|
|
<q-tab-panels v-model="tabcircuit" animated>
|
|
<q-tab-panel name="info" style="max-width: 500px">
|
|
<div v-for="(circuit, ind) of circuitslist" :key="ind">
|
|
<div class="circuit_name">{{ circuit.name }}:</div>
|
|
<CInfoAccount
|
|
:circuitname="circuit.name"
|
|
:grp="mygrp"
|
|
:account="circuit.account"
|
|
:admin="tools.iAmAdminCircuit(circuit.name)"
|
|
/>
|
|
</div>
|
|
</q-tab-panel>
|
|
<q-tab-panel name="mov">
|
|
<div v-if="circuitslist && circuitslist.length > 0">
|
|
<q-toggle v-model="tabellare" label="Tabella"></q-toggle>
|
|
|
|
<CGridTableRec
|
|
v-if="tabellare && !loading"
|
|
prop_mytable="movements"
|
|
prop_mytitle=""
|
|
:prop_mycolumns="colmyMovementTable"
|
|
prop_colkey="_id"
|
|
col_title="Lista Movimenti"
|
|
:vertical="0"
|
|
nodataLabel="Nessun Movimento effettuato"
|
|
:prop_search="true"
|
|
:enableExport="true"
|
|
hint="nota da trovare (tabella)"
|
|
:finder="false"
|
|
:choose_visutype="false"
|
|
:finder_noNull="false"
|
|
:options="shared_consts.OPTIONS_SEARCH_USER_ALL_WORDS"
|
|
:butt_modif_new="false"
|
|
noresultLabel="movimenti non trovati con questa ricerca"
|
|
filterextra=""
|
|
:prop_pagination="{
|
|
sortBy: 'transactionDate',
|
|
descending: true,
|
|
page: 1,
|
|
rowsNumber: 20,
|
|
rowsPerPage: 20,
|
|
}"
|
|
:showType="costanti.SHOW_MOVEMENTS"
|
|
:showCol="true"
|
|
:showHeaderCol="true"
|
|
:extraparams="getExtraparams_movs_grp(circuitslist[circuitIndex])"
|
|
extrafield=""
|
|
:visufind="costanti.FRIENDS"
|
|
>
|
|
</CGridTableRec>
|
|
<CGridTableRec
|
|
v-else-if="!loading"
|
|
prop_mytable="movements"
|
|
prop_mytitle=""
|
|
:prop_mycolumns="colmyMovement"
|
|
prop_colkey="_id"
|
|
col_title="Lista Movimenti"
|
|
:vertical="costanti.VISUTABLE_LISTA"
|
|
nodataLabel="Nessun Movimento effettuato"
|
|
:enableExport="true"
|
|
:prop_search="true"
|
|
hint="nota da trovare"
|
|
:finder="false"
|
|
:choose_visutype="false"
|
|
:finder_noNull="false"
|
|
:options="shared_consts.OPTIONS_SEARCH_USER_ALL_WORDS"
|
|
:butt_modif_new="false"
|
|
noresultLabel="movimenti non trovati con questa ricerca"
|
|
:prop_pagination="{
|
|
sortBy: 'transactionDate',
|
|
descending: true,
|
|
page: 1,
|
|
rowsNumber: 20,
|
|
rowsPerPage: 20,
|
|
}"
|
|
:showType="costanti.SHOW_MOVEMENTS"
|
|
:showCol="false"
|
|
:showHeaderCol="false"
|
|
:extraparams="getExtraparams_movs_grp(circuitslist[circuitIndex])"
|
|
extrafield=""
|
|
:visufind="costanti.FRIENDS"
|
|
>
|
|
</CGridTableRec>
|
|
</div>
|
|
</q-tab-panel>
|
|
</q-tab-panels>
|
|
</div>
|
|
<div
|
|
v-else
|
|
class="fit column no-wrap justify-evenly items-center content-start"
|
|
>
|
|
<q-skeleton
|
|
type="QAvatar"
|
|
size="140px"
|
|
height="140px"
|
|
animation="fade"
|
|
/>
|
|
<q-card flat bordered style="width: 250px">
|
|
<div class="text-h6">
|
|
<q-skeleton :animation="animation" />
|
|
</div>
|
|
<div class="col-12 text-h7 text-grey text-center">
|
|
{{ groupname }}
|
|
</div>
|
|
<div class="col-12 text-h7">
|
|
<q-skeleton :animation="animation" />
|
|
</div>
|
|
|
|
<div class="col-12 text-h8 q-mt-sm">
|
|
<q-skeleton :animation="animation" />
|
|
</div>
|
|
<div class="col-12 text-h8 q-mt-sm">
|
|
<q-skeleton :animation="animation" />
|
|
</div>
|
|
</q-card>
|
|
</div>
|
|
</div>
|
|
<q-dialog v-model="showPic" full-height full-width>
|
|
<img :src="getImgGrp()" :alt="groupname" class="full-width" />
|
|
</q-dialog>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts" src="./mygroup.ts">
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
@import './mygroup.scss';
|
|
</style>
|
|
|