SubAccounts !

src/components/CMyDashboard/CMyDashboard.scss

@@ -0,0 +1,53 @@
+.title-nave {
+  color: blue;
+}
+
+.titlenave{
+  width: 100px;
+  font-weight: bold;
+  text-align: center;
+}
+
+.cont_pos {
+  border: solid 2px #4198ef;
+  padding: 2px 8px;
+  margin: 2px 4px;
+  font-size: 1rem;
+  border-radius: 16px;
+}
+
+.cont_pos, .cont_pos_intest{
+  padding-left: 12px;
+  padding-right: 12px;
+  border-radius: 64px !important;
+  color: red;
+}
+
+.cont_pos_intest {
+  width: 37px;
+  font-size: 0.75rem;
+}
+
+.extra{
+  opacity: 1;
+}
+
+.passo{
+  font-weight: bold;
+  width: 100px;
+}
+
+.posizione_imbarco {
+  font-weight: bold;
+  font-size: 1rem;
+  color: blue;
+  text-align: -webkit-center;
+}
+
+.ins_invitante{
+  font-weight: bold;
+}
+
+.q-tab-panel {
+  padding: 8px;
+}

src/components/CMyDashboard/CMyDashboard.ts

@@ -21,19 +21,43 @@ import { CMyRequirement } from '../CMyRequirement'
 import { CRequisiti } from '../CRequisiti'
 import { CCardState } from '../CCardState'
 import { CMyNave } from '../CMyNave'
+import { validations } from './CMyDashboard-validate'
+import { validationMixin } from 'vuelidate'
 
 @Component({
-  components: { CProfile, CTitleBanner, CMyFieldDb, CCopyBtn, CUserBadge, CLegenda, CRequisito, CMyRequirement, CRequisiti, CCardState, CMyNave }
+  mixins: [validationMixin],
+  validations,
+  components: {
+    CProfile,
+    CTitleBanner,
+    CMyFieldDb,
+    CCopyBtn,
+    CUserBadge,
+    CLegenda,
+    CRequisito,
+    CMyRequirement,
+    CRequisiti,
+    CCardState,
+    CMyNave
+  },
 })
 
 export default class CMyDashboard extends MixinUsers {
   public $v
   public $q
   public myusername: string = ''
+  public tab: string = 'requisiti'
+  public tabcosa: string = ''
   public showuserinfo: boolean = false
+  public shownuovoviaggio: boolean = false
   public notifBot: boolean = true
+  public loading: boolean = false
   public seluser: IUserFields = null
   public aportador_solidario: string = ''
+  public invitante_username: string = ''
+  public showregalainv: boolean = false
+  public id_listaingr: number = -1
+  public ind_order_ingr: number = -1
   public dashboard: IDashboard = {
     myself: DefaultUser,
     aportador: DefaultUser,
@@ -41,7 +65,11 @@ export default class CMyDashboard extends MixinUsers {
     downline: [],
     downnotreg: [],
     downbyuser: [],
-    arrposizioni: []
+    arrimbarchi: [],
+    arrposizioni: [],
+    navi_partenza: [],
+    lastnave: {},
+    arrusers: [],
   }
 
   @Prop({ required: true }) public username
@@ -50,6 +78,9 @@ export default class CMyDashboard extends MixinUsers {
   public changedash() {
     console.log('changedash')
     this.dashboard = UserStore.state.my.dashboard
+    if (!!this.dashboard)
+      this.invitante_username = this.dashboard.myself.aportador_solidario
+
   }
 
   get mythis() {
@@ -57,25 +88,51 @@ export default class CMyDashboard extends MixinUsers {
   }
 
   public created() {
+    if (!!tools.getCookie(tools.TABBED_DASHBOARD)) {
+      this.tab = tools.getCookie(tools.TABBED_DASHBOARD)
+    }
     this.update_username()
   }
 
+  public changetab(val) {
+    tools.setCookie(tools.TABBED_DASHBOARD, val)
+    console.log('setcook', val)
+  }
+
   @Watch('this.username')
   public changeusername() {
     this.update_username()
 
   }
 
+  public aggiorna() {
+    this.dashboard = null
+    this.update_username()
+    this.showuserinfo = false
+  }
+
   public async update_username() {
-    // console.log('update_username')
+    console.log('update_username')
+    this.loading = true
     if (this.username === '')
       this.myusername = this.getMyUsername()
     else
       this.myusername = this.username
 
+    this.loading = true
+
     await UserStore.actions.getDashboard({ username: this.myusername }).then((ris) => {
       this.dashboard = ris
+
+      if (!!this.dashboard)
+        this.invitante_username = this.dashboard.myself.aportador_solidario
+
+      console.log('this.invitante_username', this.invitante_username)
+      this.loading = false
     })
+
+    this.showuserinfo = false
+    this.loading = false
   }
 
   get getRefLink() {
@@ -89,23 +146,238 @@ export default class CMyDashboard extends MixinUsers {
     return false
   }
 
-  public selectclick(user) {
+  public selectclick(user, showregalainv, ind_order_ingr, id_listaingr) {
     this.showuserinfo = true
     this.seluser = user
+    this.showregalainv = showregalainv
+    this.ind_order_ingr = ind_order_ingr
+    this.id_listaingr = id_listaingr
   }
 
   get Completato7Req() {
     // return tools.Is7ReqOk(this.dashboard.myself)
     return this.dashboard.myself.qualified
   }
+
   get Completato9Req() {
     // return tools.Is9ReqOk(this.dashboard.myself)
-    return this.dashboard.myself.qualified && (this.dashboard.myself.numinvitatiattivi >= 2)
+    if (!!this.dashboard)
+      return this.dashboard.myself.qualified && (this.dashboard.myself.numinvitatiattivi >= 2)
+    return false
   }
 
   public HasNave() {
     return this.dashboard.arrposizioni.length > 0
   }
 
+  public getnavePartenzaByRigaCol(riga, col) {
+    for (const mynave of this.dashboard.navi_partenza) {
+      if (!!mynave) {
+        if ((mynave.riga === riga) && (mynave.col === col)) {
+          return mynave
+        }
+      }
+    }
+    return null
+  }
+
+  public datanave(mianave) {
+    // const mynavepart = this.getnavePartenzaByRigaCol(tools.getRiganave(mianave.riga), tools.getColnave(mianave.col))
+    if (!!mianave.nave_partenza) {
+      if (!!mianave.nave_partenza.date_start)
+        return tools.getstrshortDate(mianave.nave_partenza.date_start)
+    }
+    return ' --/-- '
+  }
+
+  public geticon(mianave) {
+    if (!mianave)
+      return ''
+
+    if (mianave.made_gift) {
+      return 'fas fa-gift'
+    }
+  }
+
+  public colordono(mianave) {
+    if (mianave.made_gift) {
+      return 'green'
+    } else {
+      return 'grey'
+    }
+  }
+
+  public getposizioneattuale(mianave, totali) {
+    const mynavedest = tools.getfirstnaveSognatore(mianave.riga, mianave.col)
+    const ris = tools.getnumnavi_finoa(mianave, mynavedest, this.dashboard.lastnave)
+    if (totali)
+      return mianave.riga + '.' + mianave.col + ' ' + ris.contaattuale + '/' + ris.totale
+    else
+      return ris.perc
+  }
+
+  public async NuovoImbarco(username, invitante_username) {
+
+    await tools.askConfirm(this.$q, translate('steps.nuovo_imbarco'), translate('dialog.continue'), translate('dialog.yes'), translate('dialog.no'), this, '', lists.MenuAction.AGGIUNGI_NUOVO_IMBARCO, 0, {
+      param1: { username, invitante_username }
+    })
+    this.shownuovoviaggio = false
+  }
+
+  public addNuovoImbarco() {
+    this.NuovoImbarco(this.dashboard.myself.username, this.invitante_username)
+  }
+
+  public async cancellaImbarco(imbarco) {
+    await tools.askConfirm(this.$q, translate('dashboard.attenzione'), translate('steps.vuoi_cancellare_imbarco'), translate('dialog.yes'), translate('dialog.no'), this, '', lists.MenuAction.CANCELLA_IMBARCO, 0, {
+      param1: { ind_order: imbarco.ind_order, username: imbarco.username },
+      param2: { num_tess: imbarco.num_tess }
+    })
+
+  }
+
+  public getnuminvitatistr(index, myuser) {
+    let inv = myuser.numinvitati
+    let invattivi = myuser.numinvitatiattivi
+
+    const step = (index - 1) * 2
+
+    inv -= step
+    invattivi -= step
+    if (inv < 0)
+      inv = 0
+    if (invattivi < 0)
+      invattivi = 0
+    if (inv > 2)
+      inv = 2
+    if (invattivi > 2)
+      invattivi = 2
+
+    return  invattivi + '/' + inv
+  }
+
+  public getinvit(index, myuser, posiz) {
+    let inv = myuser.numinvitati
+    let invattivi = myuser.numinvitatiattivi
+
+    const step = (posiz.numNaviEntrato + index) * 2
+
+    inv -= step
+    // console.log('inv', inv, 'step = ', step)
+    invattivi -= step
+    if (inv < 0)
+      inv = 0
+    if (invattivi < 0)
+      invattivi = 0
+    if (inv > 2)
+      inv = 2
+    if (invattivi > 2)
+      invattivi = 2
+
+    return { invattivi, inv }
+  }
+  public getnuminv(index, myuser, posiz) {
+    const ris = this.getinvit(index, myuser, posiz)
+
+    return ris.inv
+  }
+  public getnuminvattivi(index, myuser, posiz) {
+    const ris = this.getinvit(index, myuser, posiz)
+
+    return ris.invattivi
+  }
+  public getnuminvperc(index, myuser, posiz) {
+    const ris = this.getinvit(index, myuser, posiz)
+
+    return ris.invattivi / 2 * 100
+  }
+  public getcolorinvitati(index, myuser, posiz) {
+
+    const ris = this.getinvit(index, myuser, posiz)
+    if (ris.invattivi === 1)
+      return 'blue'
+    if (ris.invattivi === 2)
+      return 'green'
+    if (ris.inv === 1)
+      return 'orange'
+  }
+
+  public getnumtessstr(num_tess, index) {
+
+    let str = index + 1 + '°'
+
+    if (num_tess % 2 === 0) {
+      str += ' (Gratis)'
+    }
+    return str
+  }
+
+  public errorMsg(cosa: string, item: any) {
+    try {
+      if (!item.$error) {
+        return ''
+      }
+
+      if (item.required !== undefined) {
+        if (!item.required) {
+          return this.$t('reg.err.required')
+        }
+
+      } else if (cosa === 'invitante_username') {
+        // console.log(item);
+        if (!item.aportadorexist) {
+          // console.log('!item.aportadorexist !')
+          return this.$t('reg.err.invitante_username_not_exist')
+        }
+      }
+
+      return ''
+    } catch (error) {
+      // console.log("ERR : " + error);
+    }
+  }
+
+  get allowSubmit() {
+    let error = this.$v.$error || this.$v.$invalid
+
+    error = error || (this.invitante_username === this.dashboard.myself.username)
+
+    return !error
+
+  }
+
+  public imbarchipresenti() {
+    let presente = false;
+    for (const rec of this.dashboard.arrimbarchi) {
+      if (!rec.added)
+        presente = true
+    }
+    return presente
+  }
+
+  public getcolorbynave(mianave){
+    if (!!mianave.nave_partenza)
+      return mianave.nave_partenza.provvisoria ? 'gray' : 'green'
+    else
+      return 'green'
+  }
+
+  public change_mynote(mianave) {
+
+    const mydata = {
+      note: mianave.note
+    }
+    tools.saveFieldToServer(this, 'navi', mianave._id, mydata)
+  }
+
+  public getNaveSognatoreStr(mianave, index) {
+    const mynavedest = tools.getfirstnaveSognatore(mianave.riga, mianave.col)
+    return mynavedest.riga + '.' + parseInt(mynavedest.col, 10) + index
+  }
+
+  public getNaveMediatoreStr(mianave) {
+    return mianave.riga + '.' + mianave.col
+  }
+
 
 }

src/components/CMyDashboard/CMyDashboard.vue

@@ -1,130 +1,410 @@
 <template>
   <div class="q-my-xs q-gutter-xs q-py-xs" v-if="myusername !== ''">
-    <CTitleBanner class="q-pa-xs text-center" :title="$t('pages.statoattuale')" bgcolor="bg-red" clcolor="text-white"
-                  mystyle=" " myclass="myshad">
-      <div v-if="!!dashboard.myself.name">
+    <div>
+      <q-tabs
+        v-model="tab"
+        dense
+        class="bg-blue text-white shadow-2"
+        indicator-color="white"
+        align="center"
+        narrow-indicator
+        @input="changetab"
+      >
+        <q-tab name="requisiti" icon="fas fa-check" :label="$t('reg.requirement')"></q-tab>
+        <q-tab name="invitati" icon="fas fa-users" :label="$t('dashboard.downline')"></q-tab>
+        <q-tab name="navi" icon="fas fa-ship" :label="$t('otherpages.admin.navi')"></q-tab>
 
+      </q-tabs>
+
+      <q-tab-panels v-model="tab" animated>
+        <q-tab-panel name="requisiti">
+          <div v-if="!!dashboard.myself.name">
+
+
+            <CMyRequirement :myseluser="dashboard.myself" :mydashboard="dashboard" @aggiorna="aggiorna">
+
+            </CMyRequirement>
+          </div>
+
+          <CTitleBanner class="shadow-2" :title="$t('reg.aportador_solidario')" bgcolor="bg-accent"
+                        clcolor="text-white"
+                        mystyle=" " myclass="myshad" :canopen="true">
+
+            <CUserBadge v-if="!!dashboard.aportador" :user="dashboard.aportador" :index="0"
+                        :showregalainv="false"
+                        :numpeople="dashboard.numpeople_aportador"
+                        mycolor="accent" @myclick="selectclick">
+
+            </CUserBadge>
+            <div v-else class="q-pa-sm text-center">
+              {{ $t('dashboard.nessun_invitante')}}
+            </div>
+          </CTitleBanner>
+
+          <CTitleBanner class="shadow-2" :title="$t('reg.you')" bgcolor="bg-blue"
+                        clcolor="text-white"
+                        mystyle=" " myclass="myshad" :canopen="true">
+
+            <CUserBadge v-if="!!dashboard.myself" :user="dashboard.myself" :index="0"
+                        :showregalainv="false"
+                        :numpeople="dashboard.downline.length"
+                        @myclick="selectclick"
+                        mycolor="blue">
+
+            </CUserBadge>
+          </CTitleBanner>
+
+        </q-tab-panel>
+        <q-tab-panel name="invitati">
+          <CTitleBanner class="shadow-2 rounded-borders" :title="$t('dashboard.downline')" bgcolor="bg-positive"
+                        clcolor="text-white"
+                        mystyle=" " myclass="myshad" :canopen="true">
+
+            <q-list bordered v-if="!!dashboard.downline && dashboard.downline.length > 0" class="rounded-borders">
+              <div v-for="(user, index) in dashboard.downline" :key="index">
+                <CUserBadge :yourinvite="true" :user="user" mycolor="positive" :index="index"
+                            :showregalainv="false"
+                            :numpeople="dashboard.downbyuser[user.username].length"
+                            @myclick="selectclick"
+                >
+
+                </CUserBadge>
+                <div style="margin-left:10px;" v-for="(user2, index2) in dashboard.downbyuser[user.username]"
+                     :key="index2">
+                  <CUserBadge :yourinvite="false" :user="user2" mycolor="orange" :index="index2"
+                              :showregalainv="false"
+                              :numpeople="dashboard.downbyuser[user2.username].length"
+                              @myclick="selectclick"
+                  >
+
+                  </CUserBadge>
+                </div>
+              </div>
+            </q-list>
+            <div v-else class="q-pa-sm text-center">
+              {{ $t('dashboard.nessun_invitato')}}
+            </div>
+          </CTitleBanner>
+
+          <div class="row justify-center q-ma-sm">
+            <q-btn push
+                   rounded
+                   color="primary"
+                   size="md"
+                   :label="$t('pages.invita')"
+                   icon="fas fa-user-plus"
+                   to="/invite">
+            </q-btn>
+          </div>
+
+          <CTitleBanner class="shadow-2 rounded-borders" :title="$t('reg.legenda')"
+                        bgcolor="bg-primary"
+                        clcolor="text-white"
+                        mystyle=" " myclass="myshad" :canopen="true">
+            <p class="q-ml-sm">{{ $t('dashboard.legenda_title')}}</p>
+            <q-list bordered class="rounded-borders justify-center q-pa-sm">
+              <div class="row items-center q-pa-xs">
+                <CCardState :mytext="$t('pages.statusreg.req')" :myval="7" :myperc="(7 / 9) * 100" size="50px"
+                            size_mob="40px"
+                            fontsize="0.75rem" myclass="my-card-small-stat" mycolor="orange">
+                </CCardState>
+                <div class="bg-blue text-white clBorderxs q-ml-sm">{{$t('pages.statusreg.req7')}}</div>
+              </div>
+              <div class="row items-center q-pa-xs">
+                <CCardState :mytext="$t('pages.statusreg.req')" :myval="9" :myperc="100" size="50px" size_mob="40px"
+                            fontsize="0.75rem" myclass="my-card-small-stat" mycolor="green"></CCardState>
+                <div class="bg-blue text-white clBorderxs q-ml-sm">{{$t('pages.statusreg.req9', {sitename:
+                  $t('ws.sitename')})}}
+                </div>
+              </div>
+              <div class="row items-center q-pa-xs">
+                <CCardState :mytext="$t('pages.statusreg.people')" :myval="2" :myperc="100" size="50px"
+                            size_mob="40px"
+                            fontsize="0.75rem" myclass="my-card-small-stat" mycolor="green"></CCardState>
+                <div class="bg-blue text-white clBorderxs q-ml-sm">{{$t('pages.statusreg.peoplelegend')}}</div>
+              </div>
+              <!--<CLegenda icon="fab fa-telegram" :text="`Telegram ` + $t('pages.statusreg.verified')"></CLegenda>
+              <CLegenda icon="fas fa-video" :text="$t('stat.zoom')"></CLegenda>
+              <CLegenda icon="fas fa-user-friends" :text="$t('dashboard.numinvitati')"></CLegenda>-->
+              <div class="row items-center q-pa-xs q-ml-sm">
+                <q-btn
+                  fab-mini
+                  icon="fab fa-whatsapp"
+                  color="white" text-color="green"
+                  size="sm">
+                </q-btn>
+                <div class="bg-blue text-white clBorderxs q-ml-sm">{{$t('dashboard.telefono_wa')}}</div>
+              </div>
+            </q-list>
+          </CTitleBanner>
+
+        </q-tab-panel>
+        <q-tab-panel name="navi">
+
+          <div v-if="dashboard.myself.qualified">
+            <CTitleBanner icon="fas fa-gift" :canopen="true" class="q-pa-xs text-center"
+                          :title="$t('pages.posizione_in_nave')" bgcolor="bg-green"
+                          clcolor="text-white" mystyle=" " myclass="myshad">
+
+              <div v-if="!!dashboard.myself.name">
+                <div v-if="!HasNave">
+                  <CRequisiti :statebool="Completato9Req" :msgTrue="$t('steps.enter_nave_9req_ok')"
+                              :color_ko="true"
+                              :msgFalse="$t('steps.enter_nave_9req_ko')">
+                  </CRequisiti>
+                </div>
+
+                <div v-if="loading" class="text-center" style="height: 50px;">
+                  <q-spinner-gears size="50px" color="primary"/>
+                </div>
+
+                <div class="row justify-center no-wrap">
+                  <div class="col-1 cont_pos_intest">Num</div>
+
+                  <div class="col-3 cont_intestaz ">{{$t('dashboard.nave')}}</div>
+                  <div class="col-3 cont_intestaz " v-html="$t('dashboard.data_partenza')"></div>
+                  <div class="col-3 cont_intestaz_small" v-html="$t('dashboard.doni_inviati')"></div>
+                  <div class="col-2 cont_intestaz_small" v-html="$t('reg.note')"></div>
+                  <!--<div class="col-3 cont_intestaz " v-html="$t('dashboard.tragitto')"></div>-->
+                  <!--<div class="col-1 cont_intestaz ">Tot:</div>-->
+                </div>
+
+                <div v-for="(mianave, index) in dashboard.arrposizioni" :key="index"
+                     class="q-pa-sm row items-start q-gutter-sm">
+                  <q-card class="my-card-shadow yes_shadow">
+                    <q-img
+                      src="statics/images/nave.jpg"
+                      style="width: 100%"
+                      native-context-menu>
+                      <div class="absolute-bottom text-subtitle1 text-center text-sobig">
+                        {{ getnumtessstr(mianave.num_tess, index) }} - {{$t('dashboard.nave') + ' ' +
+                        tools.getrigacolstr(mianave)}}
+                      </div>
+                    </q-img>
+                    <div class="row justify-sm-start items-center rounded-borders">
+
+                      <div class="row items-center justify-center q-ma-xs" style="width: 100%">
+                        <q-chip class="glossy q-ma-md" :color="getcolorbynave(mianave)" text-color="white"
+                                icon="fas fa-ship">
+                          &nbsp;
+                          {{ $t('dashboard.nave_in_partenza') + ' ' + datanave(mianave) }}
+                        </q-chip>
+                      </div>
+
+                      <div class="row items-center justify-center q-ma-xs">
+                        <div class="row items-center justify-around q-ma-xs no-wrap" style="width: 100%; font-weight: bold; font-size: 1rem">
+                          <div>{{$t('dashboard.donatore')}}</div>
+                          <div>{{$t('dashboard.mediatore')}}</div>
+                          <div>{{$t('dashboard.sognatore')}}</div>
+                        </div>
+                        <div class="row items-center justify-around q-ma-xs no-wrap" style="width: 100%;">
+                          <q-chip class="glossy q-ma-sm" color="red" text-color="white"
+                                  icon="fas fa-ship">
+                            {{ tools.getrigacolstr(mianave) }}
+                          </q-chip>
+                          <q-chip class="glossy q-ma-sm" color="green" text-color="white"
+                                  icon="fas fa-ship">
+                            {{ getNaveMediatoreStr(mianave)}}
+                          </q-chip>
+                          <q-chip class="glossy q-ma-sm" color="purple" text-color="white"
+                                  icon="fas fa-ship">
+                            {{ getNaveSognatoreStr(mianave, 0)}}
+                          </q-chip>
+                          <!--<span v-for="index of 8">{{ getNaveSognatoreStr(mianave, index)}} - </span>-->
+                        </div>
+                      </div>
+
+                      <div class="row items-center justify-center q-ma-xs" style="width: 100%;">
+                        <q-list>
+
+                          <q-item clickable>
+                            <q-item-section avatar>
+                              <q-icon :color="colordono(mianave)" inverted size="sm" name="fas fa-gift"
+                                      class="gift"></q-icon>
+                            </q-item-section>
+
+                            <q-item-section>
+                              <q-item-label>
+                                <div v-if="mianave.made_gift">{{ $t('dashboard.ho_effettuato_il_dono') }}</div>
+                              </q-item-label>
+                            </q-item-section>
+                          </q-item>
+                        </q-list>
+                      </div>
+                    </div>
+                    <div class="row items-center justify-around q-ma-xs">
+                      <q-input v-model="mianave.note" :label="$t('reg.note')"
+                               debounce="1000"
+                               style="width: 100%;"
+                               @input="change_mynote(mianave)">
+
+                      </q-input>
+                    </div>
+                    <div>
+                      <CMyNave :posizprop="mianave" :key="index"
+                               :navi_partenzaprop="dashboard.navi_partenza" :listanavi="false">
+
+                      </CMyNave>
+                    </div>
+
+                    <!--<q-card-actions>
+                      <q-btn flat>Action 1</q-btn>
+                      <q-btn flat>Action 2</q-btn>
+                    </q-card-actions>-->
+                  </q-card>
+                  <!--<div class="col-3">
+                      <div>
+                          <CCardState :isperc="true" size="50px" size_mob="40px" fontsize="0.75rem"
+                                      :myperc="getposizioneattuale(mianave)"></CCardState>
+                      </div>
+                  </div>-->
+                  <!--<div class="col-1">
+                      <div>
+                          {{ getposizioneattuale(mianave, true) }}
+                      </div>
+                  </div>-->
+
+                </div>
+                <CTitleBanner class=""
+                              v-if="imbarchipresenti()"
+                              :title="$t('pages.posizione_in_programmazione')"
+                              bgcolor="bg-primary"
+                              clcolor="text-white"
+                              mystyle="" myclass="myshad" canopen="true">
+                  <div class="row justify-center items-center ">
+                    <div class="col-2">
+                      {{ $t('dashboard.num_tessitura') }}
+                    </div>
+                    <div class="col-3 ">
+                      {{ $t('dashboard.posizione') }}
+                    </div>
+                    <div class="col-4 ">
+                      {{ $t('dashboard.invitante') }}
+                    </div>
+                    <div class="col-2 ">
+                      {{ $t('dashboard.downline') }}
+                    </div>
+                    <!--<div class="col-2">
+                      {{ $t('dashboard.dono_da_effettuare') }}
+                    </div>-->
+                    <div class="col-1">
+                      {{ $t('reg.elimina') }}
+                    </div>
+
+                  </div>
+
+                  <div v-for="(mioimbarco, index) in dashboard.arrimbarchi" :key="index">
+                    <div v-if="!mioimbarco.added" class="row justify-center items-center ">
+                      <div class="col-2">
+                        <div class="posizione_imbarco">{{ index }}</div>
+                      </div>
+                      <div class="col-3">
+                        <div class="posizione_imbarco">{{ mioimbarco.posiz.posiz }} / {{
+                          mioimbarco.posiz.totposiz }}
+                        </div>
+                      </div>
+                      <div class="col-4">
+                        <div class="posizione_imbarco">
+                          <CUserBadge :yourinvite="false" :showsteps="false" :showregalainv="true"
+                                      :user="dashboard.arrusers[mioimbarco.invitante_username]" mycolor="orange"
+                                      :ind_order_ingr="mioimbarco.ind_order"
+                                      :id_listaingr="mioimbarco._id"
+                                      :index="index"
+                                      :numpeople="0"
+                                      @myclick="selectclick">
+                          </CUserBadge>
+                        </div>
+                      </div>
+                      <div class="col-2">
+                        <div class="posizione_imbarco">
+                          <CCardState :mytext="$t('pages.statusreg.people')"
+                                      :myval="getnuminvattivi(index, dashboard.myself, mioimbarco.posiz)+'/'+getnuminv(index, dashboard.myself, mioimbarco.posiz)"
+                                      :myperc="getnuminvperc(index, dashboard.myself, mioimbarco.posiz)" size="50px"
+                                      size_mob="40px"
+                                      fontsize="0.75rem" myclass="my-card-small-stat"
+                                      :mycolor="getcolorinvitati(index, dashboard.myself, mioimbarco.posiz)"></CCardState>
+
+                        </div>
+                      </div>
+                      <!--<div class="col-2">
+                        <div class="posizione_imbarco">33 €</div>
+                      </div>-->
+                      <div class="col-1">
+                        <div class="posizione_imbarco">
+                          <q-btn flat round color="red" icon="fas fa-trash-alt" size="sm"
+                                 @click="cancellaImbarco(mioimbarco)"></q-btn>
+                        </div>
+                      </div>
+                    </div>
+
+                  </div>
+                  <q-btn class="q-ma-md" rounded size="md"
+                         icon="fas fa-info"
+                         color="primary" @click="shownuovoviaggio=true"
+                         :label="$t('steps.nuovo_imbarco')">
+
+                  </q-btn>
+
+                  <CRequisiti :statebool="true"
+                              :msgTrue="$t('steps.enter_prog_msg') + '<br><strong>' + $t('steps.enter_prog_msg_2') + '</strong>'"
+                              msgFalse="">
+                  </CRequisiti>
+
+                </CTitleBanner>
+
+
+                <!--<div>
+                  <CMyNave v-for="(mianave, index) in dashboard.arrposizioni" :posizprop="mianave"
+                           :key="index"
+                           :navi_partenzaprop="dashboard.navi_partenza" :listanavi="false">
+
+                  </CMyNave>
+                </div>-->
+              </div>
+
+
+            </CTitleBanner>
+
+          </div>
+
+        </q-tab-panel>
+      </q-tab-panels>
+    </div>
+
+    <div>
+
+      <div>
         <div v-if="!Completato9Req && !HasNave">
           <CTitleBanner icon="person" :canopen="true" class="q-pa-xs text-center"
                         :title="$t('pages.posizione_in_programmazione')" bgcolor="bg-blue"
                         clcolor="text-white" mystyle=" " myclass="myshad">
-            <CRequisiti :statebool="Completato7Req" :msgTrue="$t('steps.enter_prog_requisiti_ok')"
+            <CRequisiti :statebool="Completato7Req"
+                        :msgTrue="$t('steps.enter_prog_requisiti_ok') + $t('steps.enter_prog_requisiti_ok')"
                         :msgFalse="$t('steps.enter_prog_completa_requisiti')">
             </CRequisiti>
           </CTitleBanner>
         </div>
-
-        <CTitleBanner icon="fas fa-gift" :canopen="true" class="q-pa-xs text-center"
-                      :title="$t('pages.posizione_in_nave')" bgcolor="bg-green"
-                      clcolor="text-white" mystyle=" " myclass="myshad">
-
-          <div v-if="!HasNave">
-            <CRequisiti :statebool="Completato9Req" :msgTrue="$t('steps.enter_nave_9req_ok')"
-                        :color_ko="true"
-                        :msgFalse="$t('steps.enter_nave_9req_ko')">
-            </CRequisiti>
-          </div>
-
-          <CMyNave v-for="(mianave, index) in dashboard.arrposizioni" :posizprop="mianave" :key="index"
-                   :navi_partenzaprop="dashboard.navi_partenza" :listanavi="false">
-
-          </CMyNave>
-        </CTitleBanner>
-
       </div>
 
-    </CTitleBanner>
-    <CTitleBanner class="q-pa-xs" :title="$t('pages.dashboard')" bgcolor="bg-info" clcolor="text-white"
-                  mystyle=" " myclass="myshad">
 
       <div v-if="!!dashboard.myself.name">
+        <div v-if="dashboard.myself.deleted">
+          <span style="color: red;"> <h2><strong>UTENTE CANCELLATO (Nascosto: true) !</strong></h2></span>
+        </div>
 
+        <div v-if="dashboard.myself.sospeso">
+          <span style="color: blue;"> <h2><strong>UTENTE SOSPESO !</strong></h2></span>
+        </div>
 
-        <CMyRequirement :myseluser="dashboard.myself" :mydashboard="dashboard">
-
-        </CMyRequirement>
       </div>
 
-      <CTitleBanner class="shadow-2" :title="$t('reg.aportador_solidario')" bgcolor="bg-accent"
-                    clcolor="text-white"
-                    mystyle=" " myclass="myshad" :canopen="true">
-
-        <CUserBadge v-if="!!dashboard.aportador" :user="dashboard.aportador" :index="0"
-                    :numpeople="dashboard.numpeople_aportador"
-                    mycolor="accent" @myclick="selectclick">
-
-        </CUserBadge>
-        <div v-else class="q-pa-sm text-center">
-          {{ $t('dashboard.nessun_invitante')}}
-        </div>
-      </CTitleBanner>
-
-      <CTitleBanner class="shadow-2" :title="$t('reg.you')" bgcolor="bg-blue"
-                    clcolor="text-white"
-                    mystyle=" " myclass="myshad" :canopen="true">
-
-        <CUserBadge v-if="!!dashboard.myself" :user="dashboard.myself" :index="0"
-                    :numpeople="dashboard.downline.length"
-                    @myclick="selectclick"
-                    mycolor="blue">
-
-        </CUserBadge>
-      </CTitleBanner>
-
-      <CTitleBanner class="shadow-2 rounded-borders" :title="$t('dashboard.downline')" bgcolor="bg-positive"
-                    clcolor="text-white"
-                    mystyle=" " myclass="myshad" :canopen="true">
-
-        <q-list bordered v-if="!!dashboard.downline && dashboard.downline.length > 0" class="rounded-borders">
-          <div v-for="(user, index) in dashboard.downline" :key="index">
-            <CUserBadge :yourinvite="true" :user="user" mycolor="positive" :index="index"
-                        :numpeople="dashboard.downbyuser[user.username].length"
-                        @myclick="selectclick"
-            >
-
-            </CUserBadge>
-            <div style="margin-left:10px;" v-for="(user2, index2) in dashboard.downbyuser[user.username]" :key="index2">
-              <CUserBadge :yourinvite="false" :user="user2" mycolor="orange" :index="index2"
-                          :numpeople="dashboard.downbyuser[user2.username].length"
-                          @myclick="selectclick"
-              >
-
-              </CUserBadge>
-            </div>
-          </div>
-        </q-list>
-        <div v-else class="q-pa-sm text-center">
-          {{ $t('dashboard.nessun_invitato')}}
-        </div>
-      </CTitleBanner>
-
-      <div class="row justify-center q-ma-sm">
-        <q-btn push
-               rounded
-               color="primary"
-               size="md"
-               :label="$t('pages.invita')"
-               icon="fas fa-user-plus"
-               to="/invite">
-        </q-btn>
+      <div v-if="loading" class="text-center" style="height: 50px;">
+        <q-spinner-gears size="50px" color="primary"/>
       </div>
 
-      <!--<CTitleBanner v-if="invitatinotreg" class="shadow-2 rounded-borders" :title="$t('dashboard.downnotreg')"
-                    bgcolor="bg-grey"
-                    clcolor="text-white"
-                    mystyle=" " myclass="myshad" :canopen="true">
 
-        <q-list bordered v-if="!!dashboard.downnotreg" class="rounded-borders">
-          <div v-for="(user, index) in dashboard.downnotreg" :key="index">
-            <CUserBadge :yourinvite="true" :user="user" mycolor="grey" :index="index" :numpeople="user.num_invitati"
-                        @myclick="selectclick">
+    </div>
 
-            </CUserBadge>
-          </div>
-        </q-list>
-      </CTitleBanner>-->
-
-    </CTitleBanner>
 
     <!--
         <CTitleBanner class="q-pa-xs" :title="$t('text.dashboard.madegift')" bgcolor="bg-info" clcolor="text-white"
@@ -148,42 +428,6 @@
 
     </CCopyBtn>
 
-    <CTitleBanner class="shadow-2 rounded-borders" :title="$t('reg.legenda')"
-                  bgcolor="bg-primary"
-                  clcolor="text-white"
-                  mystyle=" " myclass="myshad" :canopen="true">
-      <p class="q-ml-sm">{{ $t('dashboard.legenda_title')}}</p>
-      <q-list bordered class="rounded-borders justify-center q-pa-sm">
-        <div class="row items-center q-pa-xs">
-          <CCardState :mytext="$t('pages.statusreg.req')" :myval="7" :myperc="(7 / 9) * 100" size="50px" size_mob="40px"
-                      fontsize="0.75rem" myclass="my-card-small-stat" mycolor="orange">
-          </CCardState>
-          <div class="bg-blue text-white clBorderxs q-ml-sm">{{$t('pages.statusreg.req7')}}</div>
-        </div>
-        <div class="row items-center q-pa-xs">
-          <CCardState :mytext="$t('pages.statusreg.req')" :myval="9" :myperc="100" size="50px" size_mob="40px"
-                      fontsize="0.75rem" myclass="my-card-small-stat" mycolor="green"></CCardState>
-          <div class="bg-blue text-white clBorderxs q-ml-sm">{{$t('pages.statusreg.req9', {sitename: $t('ws.sitename')})}}</div>
-        </div>
-        <div class="row items-center q-pa-xs">
-          <CCardState :mytext="$t('pages.statusreg.people')" :myval="2" :myperc="100" size="50px" size_mob="40px"
-                      fontsize="0.75rem" myclass="my-card-small-stat" mycolor="green"></CCardState>
-          <div class="bg-blue text-white clBorderxs q-ml-sm">{{$t('pages.statusreg.peoplelegend')}}</div>
-        </div>
-        <!--<CLegenda icon="fab fa-telegram" :text="`Telegram ` + $t('pages.statusreg.verified')"></CLegenda>
-        <CLegenda icon="fas fa-video" :text="$t('stat.zoom')"></CLegenda>
-        <CLegenda icon="fas fa-user-friends" :text="$t('dashboard.numinvitati')"></CLegenda>-->
-        <div class="row items-center q-pa-xs q-ml-sm">
-          <q-btn
-            fab-mini
-            icon="fab fa-whatsapp"
-            color="white" text-color="green"
-            size="sm">
-          </q-btn>
-          <div class="bg-blue text-white clBorderxs q-ml-sm">{{$t('dashboard.telefono_wa')}}</div>
-        </div>
-      </q-list>
-    </CTitleBanner>
     <br>
 
     <q-dialog v-model="showuserinfo">
@@ -195,12 +439,74 @@
           <q-btn flat round color="white" icon="close" v-close-popup></q-btn>
         </q-toolbar>
         <q-card-section class="inset-shadow" style="padding: 4px !important;">
-          <CMyRequirement :myseluser="seluser" :mydashboard="dashboard" :notitle="false">
+          <CMyRequirement :id_listaingr="id_listaingr" :myseluser="seluser" :showregalainv="showregalainv"
+                          :mydashboard="dashboard" :notitle="false" @aggiorna="aggiorna"
+                          :ind_order_ingr="ind_order_ingr">
 
           </CMyRequirement>
         </q-card-section>
       </q-card>
     </q-dialog>
+    <q-dialog v-model="shownuovoviaggio">
+      <q-card v-if="shownuovoviaggio" :style="`min-width: `+ tools.myheight_dialog() + `px;` ">
+        <q-toolbar class="bg-primary text-white" style="min-height: 30px;">
+          <q-toolbar-title>
+            {{ $t('steps.nuovo_imbarco') }}
+          </q-toolbar-title>
+          <q-btn flat round color="white" icon="close" v-close-popup @click="shownuovoviaggio=false"></q-btn>
+        </q-toolbar>
+        <q-card-section class="inset-shadow" style="padding: 4px !important;">
+
+          <CTitleBanner class="q-pa-xs text-center" :title="$t('steps.nuovo_imbarco')" bgcolor="bg-blue"
+                        clcolor="text-white"
+                        mystyle=" " myclass="myshad">
+
+            <div v-html="$t('steps.vuoi_entrare_nuova_nave')">
+
+            </div>
+            <br>
+            <div v-html="$t('steps.inserisci_invitante')" class="ins_invitante">
+
+            </div>
+            <br>
+
+
+            <div class="column q-gutter-sm justify-center text-center">
+              <q-input
+                bg-color="lightblue"
+                v-model="invitante_username"
+                rounded outlined
+                @blur="$v.invitante_username.$touch"
+                :error="$v.invitante_username.$error"
+                @keydown.space="(event) => event.preventDefault()"
+                :error-message="errorMsg('invitante_username', $v.invitante_username)"
+                maxlength="20"
+                debounce="1000"
+
+                :label="$t('reg.username_regala_invitato')">
+
+                <template v-slot:prepend>
+                  <q-icon name="person"/>
+                </template>
+
+              </q-input>
+
+              <q-toggle v-model="notifBot" :label="$t('dashboard.sendnotification')"/>
+
+              <q-btn class="q-ma-md" rounded size="md"
+                     icon="fas fa-ship"
+                     :disabled='!allowSubmit'
+                     color="positive" @click="addNuovoImbarco"
+                     :label="$t('steps.nuovo_imbarco')">
+              </q-btn>
+            </div>
+
+
+          </CTitleBanner>
+
+        </q-card-section>
+      </q-card>
+    </q-dialog>
   </div>
 </template>