From 815ca0d5650dd9c8d2be536efdba02e221c52d24 Mon Sep 17 00:00:00 2001
From: Surya Paolo <paolo.arena77@gmail.com>
Date: Sun, 8 Jan 2023 19:20:25 +0100
Subject: [PATCH] Stringi la mano (fase prima)

---
 src/components/CContactUser/CContactUser.vue  |  30 ++-
 src/components/CStatusReg/CStatusReg.ts       |   5 +
 src/components/CStatusReg/CStatusReg.vue      |  65 ++++++
 .../toolbar/notifPopover/notifPopover.vue     |   2 +
 src/model/GlobalStore.ts                      |   1 +
 src/statics/lang/it.js                        |  19 +-
 src/store/NotifStore.ts                       |  18 +-
 src/views/user/myprofile/myprofile.ts         |   2 +-
 src/views/user/myprofile/myprofile.vue        | 212 +++++++++---------
 9 files changed, 222 insertions(+), 132 deletions(-)

diff --git a/src/components/CContactUser/CContactUser.vue b/src/components/CContactUser/CContactUser.vue
index 3c610ebf..4dd04bbb 100755
--- a/src/components/CContactUser/CContactUser.vue
+++ b/src/components/CContactUser/CContactUser.vue
@@ -1,6 +1,6 @@
 <template>
-  <div class="myrow justify-evenly items-center q-pa-sm q-ma-sm">
-    <div class="col-md-6 col-sm-6 q-ma-xs col-xs-12">
+  <div class="row justify-evenly items-center q-pa-sm q-ma-sm">
+    <div class="q-ma-sx">
       <q-btn
         v-if="getLinkUserTelegram()"
         icon="fab fa-telegram"
@@ -10,15 +10,15 @@
         rounded
         :label="$t('msgs.telegrammsg')"
         :href="tools.isUserOk() ? getLinkUserTelegram() : null"
-        @click="!tools.isUserOk() ? showingtooltip = !showingtooltip : false"
+        @click="!tools.isUserOk() ? (showingtooltip = !showingtooltip) : false"
         target="__blank"
       >
       </q-btn>
-      <div v-else-if="myuser.email" class="row">
+      <div v-else-if="myuser.email" class="row q-ma-sx">
         <CLabel
           v-bind="$attrs"
           :copy="true"
-          :value="tools.isUserOk() ? myuser.email :''"
+          :value="tools.isUserOk() ? myuser.email : ''"
           :label="$t('reg.email')"
         />
 
@@ -30,13 +30,15 @@
           size="md"
           :label="$t('msgs.send_email')"
           :href="tools.isUserOk() ? tools.getemailto(myuser.email) : null"
-          @click="!tools.isUserOk() ? showingtooltip = !showingtooltip : false"
+          @click="
+            !tools.isUserOk() ? (showingtooltip = !showingtooltip) : false
+          "
           target="__blank"
         >
         </q-btn>
       </div>
     </div>
-    <div class="col-md-6 col-sm-6 q-ma-xs col-xs-12">
+    <div class="q-ma-sx">
       <q-btn
         v-if="
           userStore.getMyCircuitsInCommonByUser(myuser).length > 0 &&
@@ -52,7 +54,7 @@
       >
       </q-btn>
     </div>
-    <div v-if="myuser._id" class="col-md-6 col-sm-6 q-ma-xs col-xs-12">
+    <div v-if="myuser._id" class="q-ma-sx">
       <q-btn
         v-if="getLinkWebSite()"
         icon="fas fa-globe"
@@ -62,7 +64,7 @@
         rounded
         :label="$t('reg.website')"
         :href="tools.isUserOk() ? getLinkWebSite() : null"
-        @click="!tools.isUserOk() ? showingtooltip = !showingtooltip : false"
+        @click="!tools.isUserOk() ? (showingtooltip = !showingtooltip) : false"
         target="__blank"
       >
       </q-btn>
@@ -88,8 +90,10 @@
       >
       </q-btn>
     </div>
-    <div v-if="showBtnActivities" class="col-md-6 col-sm-6 q-ma-xs col-xs-12 text-center">
-
+    <div
+      v-if="showBtnActivities"
+      class="col-md-6 col-sm-6 q-ma-xs col-xs-12 text-center"
+    >
       <q-btn
         icon="fas fa-house-user"
         size="md"
@@ -99,8 +103,10 @@
       >
       </q-btn>
     </div>
+    <q-tooltip v-if="showingtooltip" class="bg-red text-body2 text-bold" :offset="[10, 10]" v-model="showingtooltip"
+      >Per contattare la persona:<br />Entra ed Accedi a RISO</q-tooltip
+    >
   </div>
-  <q-tooltip :offset="[10, 10]" v-model="showingtooltip">Per contattare la persona:<br>Accedi a RISO o Registrati</q-tooltip>
   <div v-if="showsendCoinTo">
     <CSendCoins
       :showprop="showsendCoinTo"
diff --git a/src/components/CStatusReg/CStatusReg.ts b/src/components/CStatusReg/CStatusReg.ts
index a2dcd7f9..6da3bc61 100755
--- a/src/components/CStatusReg/CStatusReg.ts
+++ b/src/components/CStatusReg/CStatusReg.ts
@@ -63,6 +63,7 @@ export default defineComponent({
       lastsonline: [],
       lastssharedlink: [],
       diffusorilist: [],
+      strettelist: [],
       checkuser: { verified_email: false }
     })
 
@@ -90,6 +91,9 @@ export default defineComponent({
     const diffusorilist = computed(() => {
       return datastat.value.diffusorilist
     })
+    const strettelist = computed(() => {
+      return datastat.value.strettelist
+    })
 
     watch(() => $q.appVisible, (value: any, oldval: any) => {
       // console.log('visible', value)
@@ -208,6 +212,7 @@ export default defineComponent({
       lastsonline,
       lastssharedlink,
       diffusorilist,
+      strettelist,
       datastat,
       tools,
       costanti,
diff --git a/src/components/CStatusReg/CStatusReg.vue b/src/components/CStatusReg/CStatusReg.vue
index f8b76abb..8976c1b4 100755
--- a/src/components/CStatusReg/CStatusReg.vue
+++ b/src/components/CStatusReg/CStatusReg.vue
@@ -69,6 +69,11 @@
                 :label="$t('statusreg.diffusori')"
                 icon="fas fa-medal"
               />
+              <q-tab
+                name="strettelist"
+                :label="$t('statusreg.strettelist')"
+                icon="fas fa-handshake"
+              />
             </q-tabs>
 
             <q-tab-panels v-model="mytab" animated>
@@ -224,6 +229,66 @@
                   </q-list>
                 </div>
               </q-tab-panel>
+              <q-tab-panel name="strettelist">
+                <div class="q-pa-md" style="max-width: 300px">
+                  <div class="text-center text-bold text-h6">
+                    Strette di Mano
+                  </div>
+                  <div class="text-center">
+                    Più persone conoscerai di persona e maggiore aumenterà la Rete di fiducia.
+                  </div>
+                  <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 strettelist"
+                        :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="userStore.getImgByProfile(user)" />
+                            <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 overline>
+                            <div class="index_diffusore">{{ index + 1 }}°</div>
+                          </q-item-label>
+                          <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
+                          ><div
+                            :class="
+                              `text-h6 q-mx-sm q-px-sm text-bold ` + ($q.dark.isActive ? `text-white`: `text-black`)
+                            "
+                            >{{ user.count }}
+                            </div></q-item-section
+                        >
+                      </q-item>
+                    </transition-group>
+                  </q-list>
+                </div>
+              </q-tab-panel>
               <q-tab-panel name="sharedlink">
                 <div class="q-pa-md" style="max-width: 300px">
                   <div class="text-center text-bold text-h6">
diff --git a/src/layouts/toolbar/notifPopover/notifPopover.vue b/src/layouts/toolbar/notifPopover/notifPopover.vue
index 5d6c0d59..46edaeee 100755
--- a/src/layouts/toolbar/notifPopover/notifPopover.vue
+++ b/src/layouts/toolbar/notifPopover/notifPopover.vue
@@ -90,6 +90,8 @@
 
 
             <q-item-section v-ripple>
+              status: {{notif.status}}
+              typedir: {{notif.typedir}}
               <q-item-label lines="5" :class="(!notif.read) ? 'unread' : 'read'" @click="clickNotif(notif)">
                 <div v-html="getNotifText($t, notif, false)"></div>
               </q-item-label>
diff --git a/src/model/GlobalStore.ts b/src/model/GlobalStore.ts
index 413dda10..c68d691d 100755
--- a/src/model/GlobalStore.ts
+++ b/src/model/GlobalStore.ts
@@ -35,6 +35,7 @@ export interface INotData {
   lastsonline?: IUserFields[]
   lastssharedlink?: IUserFields[]
   diffusorilist?: IUserFields[]
+  strettelist?: IUserFields[]
   checkuser?: ICheckUser | any
   numreg_untilday?: number
   reg_daily?: string
diff --git a/src/statics/lang/it.js b/src/statics/lang/it.js
index 9a554c57..e93de456 100755
--- a/src/statics/lang/it.js
+++ b/src/statics/lang/it.js
@@ -226,7 +226,7 @@ const msg_it = {
       insertgoodorservices_to_enter_circuit: 'Per poter entrare nel Circuito è necessario aggiungere almeno un Bene, Servizio o offrire Ospitalità',
       deletedgroup: 'Gruppo Eliminato',
       domanda_addtofriend: 'Aggiungere agli amici {username}?',
-      domanda_addtohandshake: 'Hai stretto la mano a {username}?',
+      domanda_addtohandshake: 'Confermi che hai conosciuto personalmente e dai la tua fiducia a {username}?<br>({username} riceverà una richiesta di conferma)" ?',
       addtohandshake: 'Hai stretto la mano a {username}',
       domanda_addtogroup: 'Aggiungi {username} al gruppo {groupname}?',
       domanda_addtocircuit: 'Aggiungi {username} al Circuito {circuitname}?',
@@ -237,7 +237,7 @@ const msg_it = {
       domanda_trusted: 'Accettare la Fiducia a {username}?',
       trusted: 'Accettato la Fiducia',
       domanda_ask_friend: 'Chiedere l\'Amicizia a {username}?',
-      domanda_ask_handshake: 'Chiedere di confermare la vostra Stretta di mano a {username}?',
+      domanda_ask_handshake: 'Confermi che hai conosciuto personalmente e dai la tua fiducia a {username} ?',
       domanda_ask_group: 'Chiedere l\'invito al Gruppo {groupname}?',
       askedtofriend: 'Chiesto l\'Amicizia a {username}',
       askedtohandshake: 'Chiesto la Stretta di mano a {username}',
@@ -1078,10 +1078,10 @@ const msg_it = {
       reject_trust: 'Revoca Fiducia',
       remove_from_myfriends: 'Rimuovi dagli Amici',
       block_user: 'Blocca Utente',
-      ask_friend: 'Chiedi l\'Amicizia',
+      ask_friend: 'Chiedi Amicizia',
       cancel_ask_friend: 'Annulla la richiesta di Amicizia',
       cancel_ask_friend_short: 'Annulla rich. Amicizia',
-      reject_ask_friend: 'Rifiuta l\'Amicizia',
+      reject_ask_friend: 'Rifiuta Amicizia',
       report_user: 'Segnala Utente',
     },
     handshake: {
@@ -1089,13 +1089,13 @@ const msg_it = {
       received: 'Ricevute',
       incommon: 'Strette in Comune',
       accept_trust: 'Accetta la Stretta di mano',
-      accepted: 'Stretta di mano Accettata',
-      refused: 'Stretta di mano Rifiutata',
-      accept: 'Accetta',
+      accepted: 'Stretta di mano confermata',
+      refused: 'Stretta di mano rifiutata',
+      accept: 'Conferma',
       refuse: 'Rifiuta',
-      accept_handshake: 'Accetta la Stretta di mano',
+      accept_handshake: 'Conferma la Stretta di mano',
       remove_from_myhandshake: 'Rimuovi dalle Strette di mano',
-      ask_handshake: 'Chiedi Stretta di mano',
+      ask_handshake: 'Stringi la mano',
       cancel_ask_handshake: 'Annulla la richiesta di Stretta di mano',
       cancel_ask_handshake_short: 'Annulla',
       reject_ask_handshake: 'Rifiuta la Stretta di mano',
@@ -1399,6 +1399,7 @@ const msg_it = {
       newreg: 'Registrati',
       onlineusers: 'OnLine',
       diffusori: 'Diffusori',
+      strettelist: 'Strette',
       sharedlink: 'Diffusori',
       nationality: 'Nazionalità',
       nationality_born: 'Nazione di Nascita',
diff --git a/src/store/NotifStore.ts b/src/store/NotifStore.ts
index 92339a8c..10b6be86 100755
--- a/src/store/NotifStore.ts
+++ b/src/store/NotifStore.ts
@@ -85,7 +85,7 @@ export const useNotifStore = defineStore('NotifStore', {
       }
     },
 
-    async setBadgeIconApp(){
+    async setBadgeIconApp() {
       // Get our dummy count and update it,
       // just to give more context for this demo.
       const countNow = this.getnumNotifUnread()
@@ -95,7 +95,7 @@ export const useNotifStore = defineStore('NotifStore', {
         await navigator.setAppBadge(countNow)
           .catch((error: any) => { /* ... */
           });
-      }catch (e) {
+      } catch (e) {
 
       }
     },
@@ -104,12 +104,14 @@ export const useNotifStore = defineStore('NotifStore', {
       return Api.SendReq(`/sendnotif/setall/${username}/${qualinotif}/${process.env.APP_ID}`, 'GET', null)
         .then((res) => {
           // console.log('res', res)
-          if (res) {
-            for (const rec of this.last_notifs) {
-              rec.read = true
+          setTimeout(() => {
+            if (res) {
+              for (const rec of this.last_notifs) {
+                rec.read = true
+              }
             }
-          }
-          this.updateArrNotif()
+            this.updateArrNotif()
+          }, 3000)
 
         })
         .catch((error) => {
@@ -178,7 +180,7 @@ export const useNotifStore = defineStore('NotifStore', {
       return ''
     },
 
-    async updateNotifDataFromServer({ username, lastdataread }: {username: string, lastdataread: Date}) {
+    async updateNotifDataFromServer({ username, lastdataread }: { username: string, lastdataread: Date }) {
       // console.log('updateNotifDataFromServer', username, lastdataread)
 
       return Api.SendReq(`/sendnotif/${username}/${lastdataread}/${process.env.APP_ID}`, 'GET', null)
diff --git a/src/views/user/myprofile/myprofile.ts b/src/views/user/myprofile/myprofile.ts
index 1b665014..f09527b0 100755
--- a/src/views/user/myprofile/myprofile.ts
+++ b/src/views/user/myprofile/myprofile.ts
@@ -102,7 +102,7 @@ export default defineComponent({
               filtroutente.value = [{ userId: myuser.value._id }]
               notifStore.setAsRead(idnotif.value)
 
-              quantiHandShake.value = (myuser.value.profile.handshake ? myuser.value.profile.handshake.length : 0) + ' ' + t('handshake.received')
+              quantiHandShake.value = (myuser.value.profile.handshake ? myuser.value.profile.handshake.length : 0) + ' ' + t('handshake.strettedimano')
               handshake_inCommon.value = userStore.getMyHandshakeInCommon(myuser.value)
               quanteHandShakeInCommon.value = (handshake_inCommon.value ? handshake_inCommon.value.length : 0) + ' ' + t('handshake.incommon')
 
diff --git a/src/views/user/myprofile/myprofile.vue b/src/views/user/myprofile/myprofile.vue
index d5405eca..8f18da82 100755
--- a/src/views/user/myprofile/myprofile.vue
+++ b/src/views/user/myprofile/myprofile.vue
@@ -218,119 +218,127 @@
           <div v-if="myuser._id" class="col-12 text-h8 q-mt-sm">
             {{ myuser.profile.biografia }}
           </div>
-          <q-banner
-            rounded
-            dense
-            size="lg"
-            class="bg-grey-1 shadow-5 q-my-sm"
-            color="primary q-title"
-            style="text-align: center"
-          >
-            <div class="mybanner bg-blue text-white">{{ $t('handshake.strettedimano')}}:</div>
-            <div v-if="userStore.IsHandShakeByUsername(myuser.username)">
-              {{ $t('db.addtohandshake', { username: myuser.username }) }}
-            </div>
-
-            <q-btn
-              v-if="handshake_inCommon && handshake_inCommon.length > 0"
-              :label="quanteHandShakeInCommon"
-              class="q-my-sm"
-              :text-color="$q.dark.isActive ? 'black' : 'black'"
-              rounded
+          <div v-if="userStore.IsHandShakeByUsername(myuser.username)">
+            <q-chip
+              color="green"
+              dense
+              class="cltexth4 chipbooked shadow-5 q-pa-sm2"
+              size="md"
               icon="fas fa-handshake"
-              @click="
-                usersList.show = true;
-                usersList.title = 'Strette di mano in Comune';
-                usersList.list = handshake_inCommon;
-              "
             >
-            </q-btn>
-            <q-btn
-              v-if="myuser.profile && myuser.profile.handshake && myuser.profile.handshake.length > 0"
-              :label="quantiHandShake"
-              class="q-my-sm"
-              :text-color="$q.dark.isActive ? 'black' : 'black'"
-              rounded
-              icon="fas fa-handshake"
-              @click="
-                usersList.show = true;
-                usersList.title = 'Lista Strette di mano';
-                usersList.list = myuser.profile.handshake;
-              "
-            >
-            </q-btn>
-
-
-            <!--HANDSHAKE-->
-            <div v-if="!isMyRecord(myuser.username)">
-              <div
-                class="row centeritems q-ma-sm q-pa-sm"
-                v-if="userStore.IsReqHandShakeByUsername(myuser.username)"
+              <span
+                >&nbsp;<em class="q-pa-xxs text-white rounded-borders shadow-2">
+                  {{ $t('db.addtohandshake', { username: myuser.username }) }}
+                </em></span
               >
-                <q-btn
-                  icon="fas fa-handshake"
-                  color="positive"
-                  :label="$t('handshake.accept_handshake')"
-                  @click="
-                    tools.addToMyHandShake(
-                      $q,
-                      myuser.username,
-                      userStore.my.username,
-                    )
-                  "
-                />
-                <q-btn
-                  icon="fas fa-handshake-alt-slash"
-                  color="negative"
-                  :label="$t('handshake.reject_ask_handshake')"
-                  @click="
-                    tools.refuseReqHandShake(
-                      $q,
-                      myuser.username,
-                      userStore.my.username,
-                    )
-                  "
-                />
-              </div>
-              <div v-else>
-                <q-btn
-                  v-if="
-                    !userStore.IsHandShakeByUsername(myuser.username) &&
-                    !userStore.IsAskedHandShakeByUsername(myuser.username)
-                  "
-                  icon="fas fa-handshake"
-                  color="primary"
-                  :label="$t('handshake.ask_handshake')"
-                  @click="
-                    tools.setRequestHandShake(
-                      $q,
-                      userStore.my.username,
-                      myuser.username,
-                      true
-                    )
-                  "
-                />
-              </div>
+            </q-chip>
+          </div>
+          <q-btn
+            v-if="
+              myuser.profile &&
+              myuser.profile.handshake &&
+              myuser.profile.handshake.length > 0
+            "
+            :label="quantiHandShake"
+            class="q-my-sm"
+            :text-color="$q.dark.isActive ? 'black' : 'black'"
+            rounded
+            icon="fas fa-handshake"
+            @click="
+              usersList.show = true;
+              usersList.title = 'Lista Strette di mano';
+              usersList.list = myuser.profile.handshake;
+            "
+          >
+          </q-btn>
+          <q-btn
+            v-if="
+              myuser.username !== myusername() &&
+              handshake_inCommon &&
+              handshake_inCommon.length > 0
+            "
+            :label="quanteHandShakeInCommon"
+            class="q-my-sm"
+            :text-color="$q.dark.isActive ? 'black' : 'black'"
+            rounded
+            icon="fas fa-handshake"
+            @click="
+              usersList.show = true;
+              usersList.title = 'Strette di mano in Comune';
+              usersList.list = handshake_inCommon;
+            "
+          >
+          </q-btn>
 
+          <!--HANDSHAKE-->
+          <div v-if="!isMyRecord(myuser.username)">
+            <div
+              class="row centeritems q-ma-sm q-pa-sm"
+              v-if="userStore.IsReqHandShakeByUsername(myuser.username)"
+            >
               <q-btn
-                v-if="
-                  userStore.IsAskedHandShakeByUsername(myuser.username) &&
-                  !userStore.IsHandShakeByUsername(myuser.username)
-                "
-                icon="fas fa-handshake-alt-slash"
-                :label="$t('handshake.cancel_ask_handshake_short')"
+                icon="fas fa-handshake"
+                color="positive"
+                :label="$t('handshake.accept_handshake')"
                 @click="
-                  tools.cancelReqHandShake(
+                  tools.addToMyHandShake(
                     $q,
-                    userStore.my.username,
-                    myuser.username
+                    myuser.username,
+                    userStore.my.username
+                  )
+                "
+              />
+              <q-btn
+                icon="fas fa-handshake-alt-slash"
+                color="negative"
+                :label="$t('handshake.reject_ask_handshake')"
+                @click="
+                  tools.refuseReqHandShake(
+                    $q,
+                    myuser.username,
+                    userStore.my.username
+                  )
+                "
+              />
+            </div>
+            <div v-else>
+              <q-btn
+                v-if="
+                  !userStore.IsHandShakeByUsername(myuser.username) &&
+                  !userStore.IsAskedHandShakeByUsername(myuser.username)
+                "
+                icon="fas fa-handshake"
+                color="primary"
+                :label="$t('handshake.ask_handshake')"
+                @click="
+                  tools.setRequestHandShake(
+                    $q,
+                    userStore.my.username,
+                    myuser.username,
+                    true
                   )
                 "
               />
             </div>
-          </q-banner>
 
-          <div v-if="!isMyRecord(myuser.username)">
+            <q-btn
+              v-if="
+                userStore.IsAskedHandShakeByUsername(myuser.username) &&
+                !userStore.IsHandShakeByUsername(myuser.username)
+              "
+              icon="fas fa-handshake-alt-slash"
+              :text-color="$q.dark.isActive ? 'black' : 'black'"
+              :label="$t('handshake.cancel_ask_handshake_short')"
+              @click="
+                tools.cancelReqHandShake(
+                  $q,
+                  userStore.my.username,
+                  myuser.username
+                )
+              "
+            />
+          </div>
+          <div v-if="!isMyRecord(myuser.username)" class="q-ma-sm">
             <div
               class="row centeritems q-ma-sm q-pa-sm"
               v-if="userStore.IsReqFriendByUsername(myuser.username)"
@@ -458,7 +466,7 @@
             />
           </div>
 
-          <CContactUser :myuser="myuser"  :showBtnActivities="true"/>
+          <CContactUser :myuser="myuser" :showBtnActivities="true" />
         </div>
 
         <div