Files
myprojplanet_vite/src/rootgen/admin/userPanel/userPanel.vue
Surya Paolo b8df3ea721 - aggiornata la grafica della Home di RISO
- Profilo Completition
- Email Verificata
- Invita un Amico (invio di email)
2025-11-15 19:38:39 +01:00

449 lines
12 KiB
Vue
Executable File

<template>
<CMyPage
img=""
:title="$t('otherpages.admin.userpanel')"
keywords=""
:description="$t('otherpages.admin.userpanel')"
>
<div class="user-panel-container">
<!-- Export Button -->
<div class="export-section">
<q-btn
unelevated
rounded
color="positive"
icon="download"
label="Esporta Lista Email"
@click="exportListaEmail"
no-caps
/>
</div>
<!-- Search Section -->
<div class="search-section">
<q-input
v-model="search"
outlined
dense
type="search"
debounce="500"
label="Cerca utente"
@keyup.enter="doSearch"
>
<template v-slot:prepend>
<q-icon name="search" />
</template>
<template v-slot:append>
<q-btn
flat
dense
rounded
color="primary"
icon="search"
@click="doSearch"
/>
</template>
</q-input>
<q-select
:behavior="$q.platform.is.ios === true ? 'dialog' : 'menu'"
v-model="colVisib"
outlined
dense
multiple
options-dense
:display-value="$t('grid.columns')"
emit-value
map-options
:options="mycolumns"
option-value="name"
@update:model-value="changeCol"
/>
</div>
<!-- User Info Section -->
<div
v-if="myuser.username"
class="user-info-section"
>
<!-- Search Result Header -->
<div class="search-result-header">
<q-icon
name="person"
size="20px"
color="primary"
/>
<span class="username-searched">{{ search }}</span>
</div>
<!-- Status Banners -->
<div class="status-banners">
<!-- Verification Status -->
<div
v-if="myuser.verified_by_aportador"
class="status-card verified"
>
<q-icon
name="verified"
size="24px"
/>
<div class="status-content">
<div class="status-title">Verificato</div>
<div class="status-subtitle">da {{ myuser.aportador_solidario }}</div>
</div>
</div>
<div
v-else
class="status-card not-verified"
>
<q-icon
name="pending"
size="24px"
/>
<div class="status-content">
<div class="status-title">Non Verificato</div>
<div class="status-subtitle">da {{ myuser.aportador_solidario }}</div>
</div>
<q-btn
flat
dense
rounded
color="positive"
icon="check"
label="Verifica"
@click="tools.verifyUser($q, getMyUsername(), myuser.username)"
no-caps
size="sm"
/>
</div>
<!-- Report Status -->
<div
v-if="myuser.reported"
class="status-card reported"
>
<q-icon
name="report"
size="24px"
/>
<div class="status-content">
<div class="status-title">Utente Segnalato</div>
<div class="status-subtitle">
{{
t('db.reporteduser', {
date_report: tools.getstrDateTimeShort(myuser.date_report),
})
}}
<br />da: {{ myuser.username_who_report }}
</div>
</div>
<q-btn
flat
dense
rounded
color="positive"
icon="lock_open"
label="Sblocca"
@click="tools.unblockUser($q, getMyUsername(), myuser.username)"
no-caps
size="sm"
/>
</div>
<div
v-else
class="action-btn-wrapper"
>
<q-btn
flat
dense
rounded
color="negative"
icon="report"
:label="`Segnala ${myuser.username}`"
@click="tools.reportUser($q, getMyUsername(), myuser.username)"
no-caps
size="sm"
/>
</div>
</div>
<!-- User Details -->
<div class="user-details-card">
<div class="section-header">
<q-icon
name="info"
size="20px"
/>
<span>Informazioni Generali</span>
</div>
<CKeyAndValue
mykey="Username"
:myvalue="myuser.username"
/>
<template v-if="myuser.profile">
<CKeyAndValue
mykey="Email"
:myvalue="myuser.email"
/>
<CKeyAndValue
mykey="Versione"
:myvalue="myuser.profile.version"
/>
<CKeyAndValue
mykey="Invitato da"
:myvalue="myuser.aportador_solidario"
/>
<CKeyAndValue
mykey="Online il"
:mydate="myuser.lasttimeonline"
/>
</template>
</div>
<!-- Telegram Section -->
<div
v-if="myuser.profile"
class="user-details-card telegram-section"
>
<div class="section-header telegram-header">
<q-icon
name="fab fa-telegram"
size="20px"
/>
<span>Telegram</span>
</div>
<CKeyAndValue
mykey="Username"
:myvalue="myuser.profile.username_telegram"
/>
<CKeyAndValue
mykey="ID"
:myvalue="myuser.profile.teleg_id"
/>
<CKeyAndValue
v-if="myuser.profile.firstname_telegram"
mykey="Nome Completo"
:myvalue="`${myuser.profile.firstname_telegram} ${myuser.profile.lastname_telegram}`"
/>
</div>
<!-- Personal Info Section -->
<div
v-if="myuser.profile"
class="user-details-card"
>
<div class="section-header">
<q-icon
name="location_on"
size="20px"
/>
<span>Dati Personali</span>
</div>
<CKeyAndValue
mykey="Provincia"
:myvalue="myuser.profile.resid_province"
/>
<CKeyAndValue
mykey="Città di Nascita"
:myvalue="myuser.profile.born_city"
/>
<CKeyAndValue
mykey="Data di Nascita"
:mydate="myuser.profile.dateofbirth"
/>
<CKeyAndValue
mykey="Biografia"
:myvalue="myuser.profile.biografia"
/>
<CKeyAndValue
mykey="Saltato Circuito Prov"
:myvalue="myuser.profile.noCircuit"
:show-set-button="true"
:on-set-value="userStore.savenoCircuit"
:valuetoSet="false"
:param2="myuser._id"
button-tooltip="Reset No Circuito"
/>
<CKeyAndValue
mykey="Saltato Circuito Ita"
:myvalue="myuser.profile.noCircIta"
:show-set-button="true"
:on-set-value="userStore.savenoCircIta"
:valuetoSet="false"
:param2="myuser._id"
button-tooltip="Reset No Circuito ITA"
/>
<CKeyAndValue
mykey="Note"
:myvalue="myuser.profile.note"
/>
<CKeyAndValue
mykey="Da Contattare"
:myvalue="myuser.profile.da_contattare"
/>
<CKeyAndValue
mykey="Facilitatore"
:myvalue="
tools.isBitActive(myuser.perm, shared_consts.Permissions.Facilitatore.value)
"
/>
<CKeyAndValue
mykey="Qualifica"
:myvalue="myuser.profile.qualifica"
/>
</div>
<!-- Notification Section -->
<div class="notification-section">
<div class="section-header">
<q-icon
name="notifications"
size="20px"
/>
<span>Invia Notifica</span>
</div>
<div class="notification-form">
<div class="form-row">
<q-select
:behavior="$q.platform.is.ios === true ? 'dialog' : 'menu'"
outlined
dense
v-model="notifdirtype"
:options="listnotiftype"
label="Tipo"
emit-value
map-options
/>
<q-select
:behavior="$q.platform.is.ios === true ? 'dialog' : 'menu'"
outlined
dense
v-model="notifidtype"
:options="listnotifid"
label="Notifica"
emit-value
map-options
/>
</div>
<q-input
v-model="title"
outlined
dense
label="Titolo"
/>
<q-input
v-model="mynotif"
outlined
dense
type="textarea"
label="Testo notifica"
rows="3"
/>
<q-btn
unelevated
rounded
color="positive"
icon="send"
:label="`Invia a ${myuser.username}`"
@click="sendNotifToUser"
no-caps
class="full-width"
/>
</div>
</div>
<!-- Test Notification Section (Manager only) -->
<div
v-if="tools.isManager()"
class="notification-section test-section"
>
<div class="section-header test-header">
<q-icon
name="bug_report"
size="20px"
/>
<span>Notifica TEST</span>
</div>
<div class="notification-form">
<div class="form-row">
<q-select
:behavior="$q.platform.is.ios === true ? 'dialog' : 'menu'"
outlined
dense
v-model="notifdirtypeTest"
:options="listnotiftypeTest"
label="Tipo"
emit-value
map-options
/>
<q-select
:behavior="$q.platform.is.ios === true ? 'dialog' : 'menu'"
outlined
dense
v-model="notifidtypeTest"
:options="listnotifidTest"
label="Notifica"
emit-value
map-options
/>
</div>
<q-input
v-model="title"
outlined
dense
label="Titolo TEST"
/>
<q-input
v-model="mynotif"
outlined
dense
type="textarea"
label="Testo notifica TEST"
rows="3"
/>
<q-btn
unelevated
rounded
color="warning"
icon="send"
:label="`Invia TEST a ${myuser.username}`"
@click="sendNotifToUserTest"
no-caps
class="full-width"
/>
</div>
</div>
</div>
<!-- Results HTML -->
<div
v-if="risultato"
class="results-section"
v-html="risultato"
></div>
</div>
</CMyPage>
</template>
<script lang="ts" src="./userPanel.ts">
import { useUserStore } from 'app/src/store/index.js';
</script>
<style lang="scss" scoped>
@import './userPanel.scss';
</style>